:root{
  --navy-50:#EEF2FA;--navy-100:#D6DFF1;--navy-300:#8FA3D1;--navy-500:#2B55AE;--navy-600:#1B4699;--navy-700:#11367F;--navy-900:#0A2258;
  --orange-50:#FFF3EC;--orange-100:#FFE0CF;--orange-300:#FFB289;--orange-400:#FF7D3B;--orange-500:#FF6C22;--orange-700:#B8470C;--orange-900:#8F3607;
  --red-50:#FFEEEA;--red-100:#FFD5CC;--red-300:#FF9A85;--red-500:#F24129;--red-700:#C4320A;--red-800:#A82A08;--red-900:#7F1F06;
  --gray-0:#FFFFFF;--gray-50:#F4F6FA;--gray-100:#EDF0F6;--gray-200:#E1E6EF;--gray-300:#C5CCD9;--gray-500:#5B6478;--gray-700:#343C52;--gray-900:#0B1430;
  --color-bg:var(--gray-0);--color-surface:var(--gray-0);--color-border:var(--gray-200);--color-text:var(--gray-900);--color-text-muted:var(--gray-500);
  --color-primary:var(--navy-700);--color-primary-hover:var(--navy-600);--color-primary-soft:var(--navy-50);
  --color-accent:var(--orange-500);--color-accent-hover:var(--orange-400);--color-accent-soft:var(--orange-50);--color-on-accent:var(--gray-900);
  --color-danger:var(--red-700);--color-danger-hover:var(--red-800);--color-danger-soft:var(--red-50);--color-hot:var(--red-500);
  --color-success:#0E7A3E;--color-success-soft:#E3F6EA;--color-focus:var(--navy-500);
  --fs-xs:12px;--fs-sm:14px;--fs-md:15px;--fs-lg:18px;--fs-xl:24px;--fs-2xl:30px;
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;
  --r-sm:8px;--r-md:12px;--r-lg:20px;--r-full:999px;
  --sh-1:0 1px 2px rgba(11,20,48,.04);--sh-2:0 10px 30px -10px rgba(11,20,48,.22),0 2px 6px rgba(11,20,48,.05);
  --sh-hover:0 14px 34px -14px rgba(17,54,127,.32),0 3px 8px -2px rgba(11,20,48,.08);--sh-pop:0 28px 70px -18px rgba(11,20,48,.42),0 0 0 1px rgba(11,20,48,.06);
  --glow-primary:0 10px 24px -8px rgba(17,54,127,.55);--glow-accent:0 10px 24px -8px rgba(255,108,34,.6);--glow-danger:0 10px 24px -8px rgba(196,50,10,.5);
  --ease:cubic-bezier(.2,.7,.2,1);--t:160ms;
  --font:Geist,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --nav-h:60px;--bottom-nav-h:64px;--sidebar-w:248px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:var(--fs-md);line-height:1.5;color:var(--color-text);background:var(--color-bg);min-height:100dvh}
a{color:var(--color-primary)}a:hover{color:var(--color-primary-hover)}
h1,h2,h3{line-height:1.25;margin:0 0 var(--sp-3);font-weight:700}
h1{font-size:var(--fs-xl)}h2{font-size:var(--fs-lg)}h3{font-size:var(--fs-md)}
p{margin:0 0 var(--sp-3)}
.route-box{border:1px solid var(--color-border);border-left:3px solid var(--color-primary);background:var(--color-primary-soft);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md)}.route-box h4{margin:0 0 var(--sp-2)}.route-steps{margin:0 0 var(--sp-2);padding-left:var(--sp-5)}.route-danger{color:var(--color-danger)}
.tabs{display:flex;flex-wrap:wrap;gap:var(--sp-1);border-bottom:1px solid var(--color-border);margin:0 0 var(--sp-4)}.tabs .tab{padding:var(--sp-2) var(--sp-3);color:var(--color-text-muted);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}.tabs .tab:hover{color:var(--color-text)}.tabs .tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:600}.org-chain,.org-tree{list-style:none;padding-left:0;margin:0}.org-chain li{padding:var(--sp-1) 0;border-left:2px solid var(--color-border);padding-left:var(--sp-3)}.org-tree .org-sub{padding-left:var(--sp-5)}.org-tree li{padding:var(--sp-1) 0}
.dir-grid{list-style:none;padding:0;margin:0;display:grid;gap:var(--sp-3);grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.dir-card{border:1px solid var(--color-border);border-radius:var(--r-md);padding:var(--sp-3);background:var(--color-surface);overflow-wrap:anywhere}.dir-more{grid-column:1/-1;text-align:center}.dir-filters{margin:0;flex-wrap:nowrap}.dir-filters select{max-width:240px}@media (max-width:720px){.dir-filters{flex-wrap:wrap}}.form-row .grow{flex:1 1 280px}
.guide-drawer>summary{list-style:none}.guide-drawer>summary::-webkit-details-marker{display:none}.guide-fab{position:fixed;right:var(--sp-4);bottom:var(--sp-4);z-index:40;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;font-size:20px;line-height:1;border-radius:50%;background:var(--color-primary);color:#fff;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.18);font-weight:600}.guide-fab:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.guide-drawer[open]::before{content:"";position:fixed;inset:0;background:rgba(15,23,42,.28);z-index:45}.guide-panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,92vw);z-index:50;background:var(--color-surface);border-left:1px solid var(--color-border);box-shadow:-8px 0 24px rgba(0,0,0,.12);padding:var(--sp-4);overflow-y:auto;transform:translateX(100%);transition:transform .18s ease-out}.guide-drawer[open] .guide-panel{transform:none}.guide-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3)}@media (max-width:1023px){.guide-fab{bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + var(--sp-3))}}.filter-bar{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin:0 0 var(--sp-3)}.filter-bar input,.filter-bar select{width:auto;min-width:0;padding:var(--sp-1) var(--sp-2)}.filter-bar .filter-grow{flex:0 1 340px;min-width:200px;max-width:100%}.search-field{position:relative;display:inline-flex;align-items:center;min-width:0}.search-field>.icon{position:absolute;left:9px;width:16px;height:16px;color:var(--gray-500);pointer-events:none}.search-field>input{width:100%;padding-left:32px!important;padding-right:30px!important}.search-spin{position:absolute;right:9px;width:14px;height:14px;border:2px solid var(--gray-300);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite;display:none;pointer-events:none}.htmx-request .search-spin,.search-field.is-loading .search-spin,.search-field>input.htmx-request~.search-spin{display:block}.combo-box{position:relative}.combo.is-loading .combo-box::after{content:'';position:absolute;right:9px;top:50%;margin-top:-7px;width:14px;height:14px;border:2px solid var(--gray-300);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}.card-tight>.card-body{padding:var(--sp-2) var(--sp-3)}.card-tight .table-wrap{border:0;border-radius:0;background:transparent}.list-toolbar{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-2)}.table-dense td,.table-dense th{padding-top:var(--sp-1);padding-bottom:var(--sp-1)}.col-check{width:1%}.pager{display:flex;gap:var(--sp-2);margin-top:var(--sp-2)}
.ts-month{--ts-weeks:6}.ts-month[data-weeks="5"]{--ts-weeks:5}.ts-month[data-weeks="4"]{--ts-weeks:4}.ts-month .ts-day{aspect-ratio:auto;min-height:44px;height:var(--ts-cell-h,clamp(44px,calc((100dvh - 380px) / var(--ts-weeks)),140px))}.seg{display:inline-flex;gap:2px;margin-left:var(--sp-2)}.ts-year{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-3)}.ts-mini{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);padding:var(--sp-2)}.ts-mini-title{display:block;font-weight:600;font-size:var(--fs-sm);margin-bottom:4px;text-decoration:none;color:var(--color-text)}.ts-mini-title:hover{color:var(--color-primary)}.ts-mini-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.ts-mini-dow{font-size:10px;text-align:center;color:var(--color-text-muted)}.ts-mini-day{font-size:10px;line-height:20px;text-align:center;border-radius:3px;background:var(--gray-100);color:var(--gray-700);text-decoration:none}.ts-mini-day.none{background:var(--gray-50);color:var(--gray-300)}.ts-mini-day.PRESENT{background:var(--color-success-soft);color:#14532D}.ts-mini-day.PARTIAL{background:var(--orange-50);color:var(--orange-900)}.ts-mini-day.ABSENT{background:var(--red-50);color:var(--red-900)}.ts-mini-day.ON_LEAVE{background:var(--navy-50);color:var(--navy-900)}.ts-mini-day.flag{outline:1.5px solid var(--red-500);outline-offset:-1.5px}.ts-mini-day.today{box-shadow:inset 0 0 0 2px var(--color-primary);font-weight:700}
.cc-day{gap:1px;padding:2px}.cc-day .cc-rate{font-size:var(--fs-xs);font-weight:600}.cc-stats{display:grid;grid-template-columns:1fr 1fr;gap:0 6px;font-size:11px;line-height:1.3;font-variant-numeric:tabular-nums}.cc-flag{color:var(--red-700);font-weight:700}.cc-day.heat-0,.ts-mini-day.heat-0{background:var(--color-success-soft);color:#14532D}.cc-day.heat-1,.ts-mini-day.heat-1{background:var(--orange-50);color:var(--orange-900)}.cc-day.heat-2,.ts-mini-day.heat-2{background:var(--orange-100);color:var(--orange-900)}.cc-day.heat-3,.ts-mini-day.heat-3{background:var(--red-100);color:var(--red-900)}.cc-day.heat-4,.ts-mini-day.heat-4{background:var(--red-300);color:var(--red-900)}.cc-day.off,.cc-day.none,.cc-day.future,.ts-mini-day.off,.ts-mini-day.future{background:var(--gray-50);color:var(--gray-300)}.cc-day.today{box-shadow:inset 0 0 0 2px var(--color-primary)}.cc-tip{position:relative}.cc-tip[data-tip]:hover::after,.cc-tip[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:30;width:max-content;max-width:260px;white-space:pre-line;text-align:left;padding:6px 8px;border-radius:var(--r-sm);background:var(--gray-900);color:#fff;font-size:12px;font-weight:400;line-height:1.45;box-shadow:0 4px 14px rgba(0,0,0,.2);pointer-events:none}@media (max-width:640px){.cc-stats{display:none}}
.sidebar{overflow-y:auto}.nav-group{margin-bottom:var(--sp-1)}.nav-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);min-height:36px}.nav-group>summary::-webkit-details-marker{display:none}.nav-group>summary::after{content:'›';font-size:16px;transition:transform .15s}.nav-group[open]>summary::after{transform:rotate(90deg)}.nav-group>summary:hover{background:var(--color-primary-soft)}.nav-group>summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}body:has(details.nav-drawer[open]) .guide-fab{display:none}.breadcrumb{margin:0 0 var(--sp-2);font-size:var(--fs-sm);color:var(--color-text-muted)}.breadcrumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:2px var(--sp-1)}.breadcrumb li{display:inline-flex;align-items:center;min-width:0;max-width:100%}.breadcrumb li+li::before{content:'›';margin-right:var(--sp-1);color:var(--gray-300)}.breadcrumb a{color:var(--color-text-muted);text-decoration:none}.breadcrumb a:hover{color:var(--color-primary);text-decoration:underline}.breadcrumb [aria-current]{color:var(--color-text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width:640px){.breadcrumb li:first-child:not(:nth-last-child(-n+2)){display:none}.breadcrumb li:first-child:not(:nth-last-child(-n+2))+li::before{display:none}}.nav-drawer{flex:1;display:flex}.nav-drawer>summary::-webkit-details-marker{display:none}.nav-menu-btn{list-style:none;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:var(--fs-xs);color:var(--color-text-muted);cursor:pointer;border-top:3px solid transparent;min-height:44px}.nav-menu-btn svg{width:22px;height:22px}.nav-drawer[open]::before{content:'';position:fixed;inset:0;background:rgba(15,23,42,.28);z-index:45}.nav-panel{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);z-index:50;background:var(--color-surface);border-right:1px solid var(--color-border);box-shadow:8px 0 24px rgba(0,0,0,.12);padding:var(--sp-4) var(--sp-3);overflow-y:auto;text-align:left}.nav-panel .nav-group a{display:flex;flex:none;flex-direction:row;justify-content:flex-start;border-top:0;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);color:var(--color-text);text-decoration:none;border-left:3px solid transparent;min-height:44px;font-size:var(--fs-sm)}.nav-panel .nav-group a svg{width:20px;height:20px;color:var(--color-text-muted)}.nav-panel .nav-group a.active{border-top:0;background:var(--color-primary-soft);border-left-color:var(--color-accent);color:var(--color-primary);font-weight:600}
.oc-head h1{flex:0 1 auto}.oc-head .seg{margin-left:0}.oc-head .page-actions{margin-left:auto}.oc-tools{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-2)}.oc-tools .chips{margin:0}.oc-tools-sep{width:1px;align-self:stretch;margin:4px var(--sp-1);background:var(--color-border)}.oc-zoom{display:inline-flex;align-items:center;gap:2px;margin-left:auto}.oc-warn{position:relative}.oc-warn>summary{list-style:none;color:var(--orange-900)}.oc-warn>summary::-webkit-details-marker{display:none}.oc-warn-pop{position:absolute;z-index:20;top:calc(100% + 4px);left:0;min-width:280px;max-width:min(420px,80vw);margin:0;padding:var(--sp-2) var(--sp-3) var(--sp-2) var(--sp-5);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:var(--sh-2);font-size:var(--fs-sm);color:var(--orange-900)}.oc-box:fullscreen{display:flex;flex-direction:column;padding:var(--sp-3);background:var(--color-bg)}.oc-box:fullscreen .oc-wrap{flex:1 1 auto;height:auto!important;min-height:0}.oc-wrap{cursor:grab}.oc-wrap.dragging{cursor:grabbing;user-select:none}.oc-wrap.dragging *{cursor:grabbing}.oc-wrap{overflow:auto;height:calc(100dvh - var(--nav-h) - 300px);min-height:360px;border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--gray-50)}.oc-canvas{display:inline-block;padding:50vh 60vw}.oc-canvas .oc{min-width:0}.oc{display:inline-block;min-width:100%}.oc ul{display:flex;justify-content:center;margin:0;padding:22px 0 0;list-style:none;position:relative}.oc>ul{padding-top:0}.oc li{position:relative;padding:22px 8px 0;display:flex;flex-direction:column;align-items:center}.oc>ul>li{padding-top:0}.oc li::before,.oc li::after{content:'';position:absolute;top:0;right:50%;width:50%;height:22px;border-top:2px solid var(--gray-300)}.oc li::after{right:auto;left:50%;border-left:2px solid var(--gray-300)}.oc li:only-child::before,.oc li:only-child::after{display:none}.oc li:only-child{padding-top:0}.oc li:first-child::before,.oc li:last-child::after{border:0 none}.oc li:last-child::before{border-right:2px solid var(--gray-300);border-radius:0 8px 0 0}.oc li:first-child::after{border-radius:8px 0 0 0}.oc>ul>li::before,.oc>ul>li::after{display:none}.oc ul ul::before{content:'';position:absolute;top:0;left:50%;height:22px;border-left:2px solid var(--gray-300)}.oc details{display:flex;flex-direction:column;align-items:center}.oc details>summary{list-style:none}.oc details>summary::-webkit-details-marker{display:none}.oc-node{display:flex;flex-direction:column;align-items:center;gap:4px;width:200px;padding:var(--sp-2) var(--sp-3);background:var(--color-surface);border:1px solid var(--color-border);border-top:3px solid var(--color-primary);border-radius:var(--r-md);box-shadow:var(--sh-1);text-align:center;position:relative;z-index:1}summary.oc-node{cursor:pointer}summary.oc-node:hover{border-color:var(--navy-300)}summary.oc-node:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.oc>ul>li>.oc-node,.oc>ul>li>details>.oc-node{border-top-color:var(--color-accent)}.oc-group{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 8px 10px;border:1px solid var(--navy-100,#dbe3f3);background:var(--navy-50);border-radius:var(--r-lg,12px);position:relative;z-index:1}.oc-group-label{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);display:inline-flex;align-items:center;gap:6px}.oc-vacant-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gray-400);cursor:help}.oc ul.oc-grp{padding-top:0;gap:0}.oc ul.oc-grp::before{display:none}.oc ul.oc-grp>li{padding-top:0}.oc ul.oc-grp>li::before,.oc ul.oc-grp>li::after{display:none}.oc-node.vacant{border-style:dashed;border-top-style:solid;border-top-color:var(--orange-300);background:var(--gray-50)}.oc-node.inactive{opacity:.6}.oc-title{font-size:var(--fs-sm);line-height:1.3}.oc-meta{font-size:11px;color:var(--color-text-muted);line-height:1.3}.oc-people{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px;font-size:var(--fs-sm)}.oc-stack{display:inline-flex}.oc-stack .avatar-sm{margin-left:-8px;border:2px solid var(--color-surface)}.oc-stack .avatar-sm:first-child{margin-left:0}.oc-badges{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.oc-toggle{font-size:11px;color:var(--color-text-muted)}.oc-toggle::after{content:' ▾'}.oc details:not([open])>summary .oc-toggle::after{content:' ▸'}.oc details:not([open])>summary .oc-toggle{color:var(--color-primary);font-weight:600}.tree-list{border-left:0}.tree-list>li{position:relative}.tree-list>li::before{content:'';position:absolute;left:-14px;top:0;bottom:0;border-left:1.5px solid var(--gray-300)}.tree-list>li:last-child::before{bottom:auto;height:21px}.tree-list>li::after{content:'';position:absolute;left:-14px;top:20px;width:11px;border-top:1.5px solid var(--gray-300)}.tree-list.root>li::before,.tree-list.root>li::after{display:none}.node-kind{padding:1px 6px;border-radius:var(--r-full);background:var(--gray-100);min-width:0}.node-branch>details>summary{font-size:var(--fs-md);background:var(--navy-50);margin-top:var(--sp-2)}.node-branch>details>summary .node-kind{background:var(--color-primary);color:#fff}.node-unit>details>summary .node-kind{background:var(--orange-50);color:var(--orange-900)}.node-pos>details>summary .node-kind{background:var(--gray-100)}.node.node-emp{font-size:var(--fs-sm)}@media (hover:hover){.node-actions{visibility:hidden}.node>details>summary:hover .node-actions,.node>details>summary:focus-within .node-actions{visibility:visible}}
.card-form>.card-body{padding-top:var(--sp-3)}.leave-split{display:flex;flex-direction:column;gap:4px}.leave-split .check{font-weight:400}.form-context{margin:0 0 var(--sp-2);font-size:var(--fs-sm);color:var(--color-text-muted)}.form-context b{color:var(--color-text)}.form-compact{max-width:640px}.form-compact .field{margin-bottom:var(--sp-2)}.form-compact textarea{min-height:0}.date-range{border:0;margin:0 0 var(--sp-2);padding:0;min-width:0}.date-range legend{padding:0;margin-bottom:var(--sp-1);font-weight:600;font-size:var(--fs-sm)}.date-slot{display:grid;grid-template-columns:36px minmax(0,1fr) 96px;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-2)}.date-slot>label{font-size:var(--fs-sm);color:var(--color-text-muted)}.date-slot input,.date-slot select{width:100%;min-width:0}.rp-links{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);align-items:flex-start}.rp-more>summary{list-style:none;cursor:pointer;color:var(--color-primary);font-size:var(--fs-sm);text-decoration:underline;padding:var(--sp-1) 0;min-height:32px;display:inline-flex;align-items:center}.rp-more>summary::-webkit-details-marker{display:none}.rp-more>summary::after{content:' ▸';text-decoration:none}.rp-more[open]>summary::after{content:' ▾'}.rp-more[open]{flex-basis:100%}.rp-more>.stack,.rp-more>fieldset{margin-top:var(--sp-2)}.att-more{margin:0 0 var(--sp-2)}.spinner{display:inline-block;width:14px;height:14px;border:2px solid var(--gray-300);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite;vertical-align:-2px}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner,.search-spin,.combo.is-loading .combo-box::after{animation:none}}.photo-log{font-size:var(--fs-sm);max-height:240px;overflow:auto}.email-editor{display:grid;gap:var(--sp-4);grid-template-columns:1fr}@media (min-width:1100px){.email-editor{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.email-editor textarea{font-family:inherit}.email-preview{border:1px solid var(--color-border);border-radius:var(--r-md);overflow:hidden;background:var(--color-surface)}.email-preview-subject{padding:var(--sp-2) var(--sp-3);background:var(--gray-50);border-bottom:1px solid var(--color-border);font-size:var(--fs-sm)}.email-preview-body{padding:var(--sp-3) var(--sp-4);font-size:14px;line-height:1.5}.email-preview-body h3{font-size:16px;margin:0 0 var(--sp-3)}.email-preview-body p{margin:0 0 var(--sp-2)}.email-preview-btn{display:inline-block;margin:var(--sp-3) 0;background:#2563eb;color:#fff;padding:8px 14px;border-radius:6px}.email-preview-foot{color:var(--gray-500);font-size:12px;margin-top:var(--sp-4)!important}.var-list{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:var(--fs-sm)}.var-list code{background:var(--gray-100);padding:1px 4px;border-radius:4px}.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-2)}.trip-only{display:none}.form-wfh:has(#kind option[value="BUSINESS_TRIP"]:checked) .trip-only{display:block}.leave-quote{font-size:var(--fs-sm);margin:0 0 var(--sp-2);min-height:20px;line-height:1.5}.quote-warn{display:inline-block;color:var(--orange-900);background:var(--orange-50);padding:2px var(--sp-2);border-radius:var(--r-sm)}.route-box{padding:var(--sp-2) var(--sp-3)}.rp-cc{font-size:var(--fs-sm);padding:var(--sp-1) 0;min-height:32px;display:inline-flex;align-items:center}@media (max-width:640px){.breadcrumb:has(li:nth-child(2):last-child){display:none}}.route-box .route-steps{margin-bottom:var(--sp-1)}.route-box>p.muted{margin:0 0 var(--sp-1)}.sticky-actions{position:sticky;bottom:0;z-index:5;background:var(--color-surface);margin:var(--sp-3) calc(-1 * var(--sp-4)) calc(-1 * var(--sp-4));padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--color-border);border-radius:0 0 var(--r-md) var(--r-md)}@media (max-width:1023px){.sticky-actions{bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom));box-shadow:0 -4px 12px rgba(15,23,42,.06)}.sticky-actions .btn-primary{flex:1;min-height:44px}body:has(.sticky-actions) .guide-fab{bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + 84px)}}
small,.muted{color:var(--color-text-muted);font-size:var(--fs-sm)}
.num{font-variant-numeric:tabular-nums;text-align:right}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px;border-radius:var(--r-sm)}

/* Layout */
.topbar{position:sticky;top:0;z-index:20;height:var(--nav-h);background:var(--color-primary);color:#fff;display:flex;align-items:center;gap:var(--sp-3);padding:0 var(--sp-4);box-shadow:var(--sh-1)}
.topbar .brand{display:flex;align-items:center;gap:var(--sp-2);color:#fff;text-decoration:none;font-weight:700;font-size:var(--fs-lg);letter-spacing:.2px;min-width:0}
.topbar .brand .logo{width:30px;height:30px;flex:none;display:block}.topbar .brand-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:640px){.topbar .brand{font-size:var(--fs-md)}.topbar .user .person>a:not(.person-photo){display:none}}.topbar .env-badge{font-size:var(--fs-xs);font-weight:700;letter-spacing:.04em;padding:1px 6px;border-radius:var(--r-sm);background:var(--color-accent);color:#fff}
.topbar .spacer{flex:1}
/* ADR-86 §10.5: nhãn phiên bản miễn phí trên thanh trên cùng — viên thuốc cam trên nền navy, dấu sao 4 cánh; bấm mở giải thích. */
.topbar .plan-free{flex:none}.topbar .plan-free>summary{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px 0 9px;border-radius:999px;font-size:var(--fs-xs);font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#FFE0CF;background:linear-gradient(135deg,rgba(255,108,34,.34),rgba(255,108,34,.12));box-shadow:inset 0 0 0 1px rgba(255,140,80,.7);white-space:nowrap;transition:background .15s ease,box-shadow .15s ease}.topbar .plan-free>summary:hover,.topbar .plan-free[open]>summary{background:linear-gradient(135deg,rgba(255,108,34,.5),rgba(255,108,34,.22));box-shadow:inset 0 0 0 1px #FF8A4C,0 0 0 3px rgba(255,108,34,.18)}.topbar .plan-free>summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.plan-free-mark{width:10px;height:10px;flex:none;background:#FFB289;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}.topbar .plan-free>summary:has(.plan-free-cta){padding-right:3px}.plan-free-cta{margin-left:2px;padding:3px 10px;border-radius:999px;background:#FF6C22;color:#1A0A02;text-transform:none;letter-spacing:0;font-weight:700}.topbar .plan-free>summary:hover .plan-free-cta{background:#FF8A4C}@media (max-width:640px){.plan-free-cta{display:none}.topbar .plan-free>summary,.topbar .plan-free>summary:has(.plan-free-cta){padding:0 9px 0 7px}}.topbar .plan-free-panel{color:var(--color-text);font-size:var(--fs-sm);font-weight:400;display:grid;gap:var(--sp-2);justify-items:start}.topbar .plan-free-panel p{margin:0}.nav-group a.nav-locked{color:var(--color-text-muted)}.nav-group a.nav-locked svg{opacity:.6}.nav-upgrade{margin-left:auto;flex:none;padding:1px 8px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;color:var(--orange-900);background:var(--orange-50);box-shadow:inset 0 0 0 1px rgba(255,108,34,.35)}
.contents{display:contents}
.form-compact textarea{min-height:0;width:100%;line-height:1.45}
/* Form gửi đơn trên màn rộng (chủ dự án 2026-10-13): ô chỉ rộng vừa giá trị — ngày / giờ / ô chọn không kéo hết hàng;
   "Từ" và "Đến" của nghỉ phép cùng một hàng. Mobile giữ full width (dễ chạm). */
/* Mọi form trên màn rộng: ô ngày / giờ / ô chọn chỉ rộng vừa giá trị (review UI/UX #7). */
@media (min-width:640px){
  .field>input[type=date]{width:11.5rem;max-width:100%;align-self:flex-start}
  .field>input[type=time]{width:9rem;max-width:100%;align-self:flex-start}
  .field>select{width:auto;min-width:12rem;max-width:100%;align-self:flex-start}
  .field>textarea{width:100%}
}
@media (min-width:640px){
  .form-compact .field input[type=date],.form-compact .date-slot>input[type=date]{width:11.5rem;max-width:100%}
  .form-compact .field input[type=time]{width:9rem;max-width:100%}
  .form-compact .field>select{width:auto;min-width:12rem;max-width:100%;align-self:flex-start}
  .form-compact .field>input[type=date],.form-compact .field>input[type=time]{align-self:flex-start}
  .form-compact .pair{grid-template-columns:repeat(2,max-content);column-gap:var(--sp-5)}
  .form-compact .date-range{display:flex;flex-wrap:wrap;column-gap:var(--sp-5)}
  .form-compact .date-range>legend{width:100%}
  .form-compact .date-slot{grid-template-columns:auto 11.5rem 6.5rem}
}
.decide-row{display:flex;gap:var(--sp-2);align-items:flex-start;flex-wrap:wrap}.decide-row>form{margin:0}.decide-row>details[open]{flex:1 1 20rem;max-width:36rem}.decide-row textarea{width:100%}.decide-row details form>.btn{align-self:flex-start}
details>summary.btn{display:flex}
.task-reason{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--color-danger);color:#fff;font-size:11px;font-weight:700;line-height:1;margin-left:auto}.count-badge[hidden]{display:none}[hidden]{display:none!important}
.bell{position:relative}.bell>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:2px;color:#fff;padding:6px;border-radius:var(--r-md);min-height:40px;min-width:40px;justify-content:center}.bell>summary::-webkit-details-marker{display:none}.bell>summary:hover{background:rgba(255,255,255,.12)}.bell>summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}.bell>summary .icon{width:22px;height:22px}.bell>summary .count-badge{position:absolute;top:2px;right:0;margin:0}
.topbar .bell-panel a:not(.btn),.topbar .bell-panel a:not(.btn):hover{color:var(--color-text);text-decoration:none}.topbar .bell-panel .btn-ghost{color:var(--color-primary);border-color:var(--color-border)}.topbar .bell-panel .btn-ghost:hover{background:var(--color-primary-soft)}
.bell-panel{position:absolute;right:0;top:calc(100% + 6px);width:min(380px,calc(100vw - 16px));max-height:min(70vh,560px);overflow-y:auto;background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:var(--sp-3);z-index:60;font-size:var(--fs-sm)}
.count-dot{position:absolute;top:8px;right:8px;width:9px;height:9px;border-radius:50%;background:var(--color-danger);box-shadow:0 0 0 2px var(--color-primary)}.topbar .help-link{display:flex;align-items:center;justify-content:center;color:#fff;padding:6px;border-radius:var(--r-md);min-height:40px;min-width:40px}.topbar .help-link:hover{background:rgba(255,255,255,.12)}.topbar .help-link .icon{width:22px;height:22px}.whats-new-list{list-style:none;margin:var(--sp-2) 0;padding:0}.whats-new-list li{padding:var(--sp-2) 0;border-top:1px solid var(--color-border)}.whats-new-list .when{color:var(--color-text-muted);font-size:var(--fs-xs)}details.faq{border-top:1px solid var(--color-border);padding:var(--sp-2) 0}details.faq>summary{cursor:pointer;font-weight:600}
@media (max-width:640px){.bell-panel{position:fixed;left:8px;right:8px;top:calc(var(--nav-h) + 4px);width:auto}}
.bell-panel h4{margin:var(--sp-2) 0 var(--sp-1);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.bell-panel h4:first-child{margin-top:0}
.inbox-list{list-style:none;margin:0;padding:0}.inbox-list li{border-bottom:1px solid var(--color-border)}.inbox-list li:last-child{border-bottom:0}.inbox-list a{display:block;padding:var(--sp-2) var(--sp-1);color:var(--color-text);text-decoration:none;border-radius:var(--r-sm)}.inbox-list a:hover{background:var(--color-primary-soft)}.inbox-list .t{font-weight:600}.inbox-list .s{color:var(--color-text-muted);font-size:var(--fs-xs)}.inbox-list .unread .t::before{content:'';display:inline-block;width:8px;height:8px;border-radius:4px;background:var(--color-accent);margin-right:6px;vertical-align:middle}.inbox-list .read .t{font-weight:400;color:var(--color-text-muted)}
.bottom-nav a{position:relative}.bottom-nav .count-badge{position:absolute;top:2px;left:calc(50% + 6px);margin:0}
.punch-compact{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2) var(--sp-4)}.punch-now b{font-size:var(--fs-xl);color:var(--color-primary);margin-right:var(--sp-1)}
.ctx-lines{list-style:none;margin:var(--sp-1) 0 0;padding:0;font-size:var(--fs-sm);color:var(--color-text-muted)}.list .ctx-lines li,.ctx-lines li{display:block;border:0;padding:0;min-height:0;background:none}.ctx-lines li::before{content:'• ';color:var(--color-accent)}
.pre-wrap{white-space:pre-wrap}.multiline{white-space:pre-wrap;overflow-wrap:anywhere}.present-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-3)}.present-bar .spacer{flex:1}.present-timer{font-variant-numeric:tabular-nums;font-weight:700;color:var(--color-primary);padding:0 var(--sp-2)}.present-title{font-size:clamp(1.4rem,2.6vw,2.2rem);line-height:1.25;margin:0 0 var(--sp-1)}.present-meta{color:var(--color-text-muted);margin:0 0 var(--sp-4)}.present-body{font-size:1.1rem;line-height:1.6}.present-ask{font-size:1.1rem;padding:var(--sp-3);border-left:4px solid var(--color-accent);background:var(--orange-50);border-radius:var(--r-sm)}.present-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-5)}@media (max-width:900px){.present-grid{grid-template-columns:1fr}}.present-add>summary{list-style:none}.present-add>summary::-webkit-details-marker{display:none}.present:fullscreen{background:var(--color-bg);padding:0 var(--sp-6) var(--sp-6);overflow:auto}
/* Toàn màn hình: không còn header (56px) → thanh trình chiếu dính sát đỉnh (trước đây dính ở 56px, đè lên tiêu đề + "Tiếp ›"); cột Chi tiết dính ngay dưới thanh. */
.present:fullscreen .present-bar{top:0;padding:var(--sp-3) 0;border-bottom:1px solid var(--color-border);margin-bottom:var(--sp-3)}
.present:fullscreen .ws-grid>.ws-props{top:72px}
.stack-tight{display:flex;flex-direction:column;gap:var(--sp-1)}.field-error{color:var(--red-700);margin:0;font-size:var(--fs-xs)}.board-table td{vertical-align:top}.board-table tr.board-topic td{border-top:2px solid var(--color-border)}.board-table .board-cont{border-top:0}.board-conclusion{max-width:28ch;font-size:var(--fs-xs)}.cell-edit{cursor:pointer}.cell-edit:hover,.cell-edit:focus{background:var(--gray-100);outline:none}.cell-editing{background:var(--gray-100);min-width:16ch}.cell-editing textarea,.cell-editing input[type=text]{width:100%}.board-add td{border-top:0;padding-top:0}
.row-selected td{background:var(--gray-100)}a.stat{text-decoration:none;color:inherit;display:block}a.stat:hover,a.stat:focus{border-color:var(--color-primary);outline:none}.module-tabs{margin-bottom:var(--sp-3)}
.col-toggle{width:28px;padding-left:2px!important;padding-right:2px!important}.board-x>td{background:var(--gray-50);border-left:3px solid var(--color-primary);padding:var(--sp-3) var(--sp-4)!important}.board-x-head{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-2)}.board-x-head .spacer{flex:1}.board-x .stack-page{gap:var(--sp-3)}
.flow{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-2)}.flow-step{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-2) var(--sp-3);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface)}.flow-no{flex:none;width:26px;height:26px;border-radius:50%;background:var(--color-primary);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--fs-sm)}
.topic-split{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--sp-4);align-items:start}@media (max-width:1100px){.topic-split{grid-template-columns:1fr}}.split-right{display:flex;flex-direction:column;gap:var(--sp-3)}.split-right .stack-page{gap:var(--sp-3)}.subtasks{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);padding:var(--sp-3)}.subtasks-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-2)}.quick-add{margin-bottom:var(--sp-2)}.quick-add input{width:100%}.subtask-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.subtask{border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-bg)}.subtask[open]{border-color:var(--color-primary)}.subtask-row{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);cursor:pointer;list-style:none}.subtask-row::-webkit-details-marker{display:none}.subtask-row::before{content:'▸';color:var(--color-text-muted);flex:none}.subtask[open]>.subtask-row::before{content:'▾'}.st-title{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.st-meta{display:flex;gap:var(--sp-3);align-items:center;font-size:var(--fs-sm);color:var(--color-text-muted);flex-wrap:wrap;justify-content:flex-end}.st-due.danger{color:var(--red-700);font-weight:600}.subtask-body{padding:var(--sp-2) var(--sp-3) var(--sp-3);border-top:1px solid var(--color-border)}.subtask-body .stack-page{gap:var(--sp-3)}
.quick-add input{padding:var(--sp-2) var(--sp-3);border:1px dashed var(--color-border);border-radius:var(--r-md);background:var(--color-bg);font:inherit}.quick-add input:focus{border-style:solid;border-color:var(--color-primary);outline:none}.subtask-detail>.card{border:0;box-shadow:none;padding:0;background:transparent}.subtask-detail .card-body{padding:0}.subtask-detail .form-row{gap:var(--sp-2)}
.subtask-detail .field textarea{min-height:44px;line-height:1.45}.subtask-detail .field{margin-bottom:var(--sp-1)}.subtask-detail .form-row{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width:640px){.subtask-detail .form-row{grid-template-columns:1fr}}
.issue-panel{display:flex;flex-direction:column;gap:var(--sp-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-lg);padding:var(--sp-4)}.issue-head{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}.issue-key{margin-left:auto;font-size:var(--fs-sm)}.issue-title{font-size:1.15rem;font-weight:700;line-height:1.35}.issue-title .prop-value{padding:2px 6px;margin:-2px -6px}.issue-section{display:flex;flex-direction:column;gap:var(--sp-1)}.issue-section h4{margin:0 0 var(--sp-1);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted)}.desc-label{font-size:var(--fs-sm);color:var(--color-text-muted);margin-top:var(--sp-1)}.props{display:grid;grid-template-columns:minmax(110px,34%) 1fr;gap:2px var(--sp-3);margin:0;align-items:center}.props>dt{color:var(--color-text-muted);font-size:var(--fs-sm);padding:6px 0}.props>dd{margin:0;min-width:0}.prop-value{display:block;min-height:32px;padding:5px 8px;margin:0 -8px;border-radius:var(--r-sm);border:1px solid transparent;overflow-wrap:anywhere}.prop-value.cell-edit:hover,.prop-value.cell-edit:focus{background:var(--gray-100);border-color:var(--color-border)}.prop-value.cell-editing{background:transparent;padding:0;margin:0}.inline-form{display:flex;flex-direction:column;gap:var(--sp-1)}.inline-form>.btn{align-self:flex-start}.inline-actions{display:flex;gap:var(--sp-1);justify-content:flex-end}.inline-form .combo-box{min-height:40px}.inline-pair{display:grid;grid-template-columns:1fr 5rem;gap:var(--sp-1)}.callout{border:1px solid var(--color-border);border-left:4px solid var(--color-accent);border-radius:var(--r-md);background:var(--orange-50);padding:var(--sp-3)}.callout h3{margin-top:0;font-size:var(--fs-md)}details.popover{position:relative;display:inline-block}details.popover>summary{list-style:none;cursor:pointer}details.popover>summary::-webkit-details-marker{display:none}.popover-panel{position:absolute;z-index:70;top:calc(100% + 6px);left:0;min-width:280px;max-width:min(380px,90vw);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:0 10px 28px rgba(15,23,42,.16);padding:var(--sp-3)}.popover-wide{min-width:340px}.popover-title{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);margin-bottom:var(--sp-2)}.option-list{display:flex;flex-direction:column;gap:2px}.option-list label{display:flex;gap:var(--sp-2);align-items:center;padding:6px 8px;border-radius:var(--r-sm);cursor:pointer}.option-list label:hover{background:var(--gray-100)}.lozenge-btn{display:inline-flex;align-items:center;gap:4px;padding:2px 4px;border-radius:var(--r-sm);color:var(--color-text-muted)}.lozenge-btn:hover{background:var(--gray-100)}.avatar-stack{display:inline-flex;align-items:center}.mini-avatar{width:24px;height:24px;border-radius:50%;object-fit:cover;border:2px solid var(--color-surface);margin-left:-6px;flex:none;background:var(--gray-100)}.avatar-stack .mini-avatar:first-child{margin-left:0}.mini-avatar-empty,.mini-avatar-more{display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--color-primary);background:var(--color-primary-soft)}.people-list .mini-avatar,.timeline .mini-avatar{margin-left:0}.followers{display:inline-flex;align-items:center;gap:var(--sp-1);flex-wrap:wrap}.avatar-stack-btn{display:inline-flex;align-items:center;gap:6px;padding:3px 8px 3px 4px;border-radius:var(--r-full)}.avatar-stack-btn:hover{background:var(--gray-100)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--color-text-muted);font-size:16px;line-height:1;cursor:pointer;padding:0}.icon-btn:hover{background:var(--gray-100);color:var(--color-text)}.icon-btn-add{border:1px dashed var(--color-border)}.people-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;max-height:300px;overflow-y:auto}.people-list li{display:flex;align-items:center;gap:var(--sp-2);padding:6px 4px;border-radius:var(--r-sm)}.people-list li:hover{background:var(--gray-50)}.people-main{flex:1;min-width:0;display:flex;flex-direction:column}.people-name{font-weight:600;font-size:var(--fs-sm)}.people-sub{font-size:var(--fs-xs);color:var(--color-text-muted)}.segmented{display:inline-flex;border:1px solid var(--color-border);border-radius:var(--r-md);overflow:hidden}.segmented label{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;font-size:var(--fs-sm);cursor:pointer}.segmented label+label{border-left:1px solid var(--color-border)}.segmented label:has(input:checked){background:var(--color-primary-soft);color:var(--color-primary);font-weight:600}.segmented input{width:auto;min-height:0}.comment-box{display:flex;flex-direction:column;gap:var(--sp-1)}.comment-box textarea{min-height:44px;resize:vertical}.comment-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}details.activity>summary{cursor:pointer;font-size:var(--fs-sm);color:var(--color-text-muted);list-style:none}details.activity>summary::-webkit-details-marker{display:none}details.activity>summary::before{content:'▸ '}details.activity[open]>summary::before{content:'▾ '}.timeline{list-style:none;margin:var(--sp-2) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--sp-2)}.timeline li{display:flex;gap:var(--sp-2);font-size:var(--fs-sm)}.timeline-detail{color:var(--color-text);margin-top:2px}.progress-inline{display:inline-flex;align-items:center;gap:var(--sp-2)}.progress-inline progress{width:120px;height:8px;accent-color:var(--color-primary)}.subtask-detail.issue-panel{border:0;padding:0;background:transparent}
.popover-panel .combo-input,.inline-form .combo-input{border:0;box-shadow:none;min-height:32px;padding:var(--sp-1);border-radius:0;background:transparent}.popover-panel .combo-input:focus,.inline-form .combo-input:focus{box-shadow:none;border:0}
.inline-form input,.inline-form select,.inline-form textarea{min-height:36px;font-size:var(--fs-sm);padding:6px 10px}.popover-panel .hint{white-space:normal;overflow-wrap:anywhere;margin:0}
.copyable{display:inline-flex;align-items:center;gap:2px;max-width:100%;vertical-align:middle}.copy-val{overflow-wrap:anywhere}.copy-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;min-height:0;padding:0;border:0;border-radius:var(--r-sm);background:transparent;color:var(--color-text-muted);cursor:pointer;opacity:0;transition:opacity .12s}.copy-btn .icon{width:15px;height:15px}.copyable:hover .copy-btn,.copy-btn:focus-visible,.copy-btn.copied{opacity:1}.copy-btn:hover{background:var(--gray-100);color:var(--color-primary)}.copy-btn{position:relative}.copy-btn.copied{color:var(--color-success)}.copy-btn.copied::after{content:"Đã sao chép";position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:4px;white-space:nowrap;font-size:var(--fs-xs);font-weight:600;color:#fff;background:var(--color-success);padding:2px 6px;border-radius:var(--r-sm);z-index:5}@media (hover:none){.copy-btn{opacity:.7}}.combo{position:relative}.combo-box{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1);min-height:44px;padding:var(--sp-1) var(--sp-2);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface);cursor:text}.combo-box:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent)}.combo-box .combo-input:focus,.combo-box .combo-input:focus-visible{outline:0;border:0;box-shadow:none}.tag-x:focus-visible{outline:2px solid var(--color-focus);outline-offset:0}.combo-box .combo-input{flex:1 1 160px;width:auto;min-width:120px;border:0;outline:0;box-shadow:none;padding:var(--sp-1);background:transparent;min-height:32px}.tag{display:inline-flex;align-items:center;gap:2px;max-width:100%;padding:2px 2px 2px var(--sp-1);border-radius:999px;background:var(--color-primary-soft);font-size:var(--fs-sm)}.tag .person{font-weight:500;gap:var(--sp-1);min-width:0}.tag .person>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag-x{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-height:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--color-text-muted);cursor:pointer;font-size:16px;line-height:1}.tag-x:hover,.tag-x:focus-visible{background:var(--color-surface);color:var(--color-danger)}.combo-list{position:absolute;z-index:60;left:0;right:0;top:calc(100% + 2px);margin:0;padding:var(--sp-1) 0;list-style:none;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:0 8px 24px rgba(15,23,42,.14);max-height:300px;overflow-y:auto}.combo-list [role=option]{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);cursor:pointer}.combo-list [role=option].active,.combo-list [role=option]:hover{background:var(--color-primary-soft)}.combo-list [role=option].picked{opacity:.55}.combo-note{font-size:var(--fs-sm)}.combo-msg{padding:var(--sp-2) var(--sp-3);color:var(--color-text-muted);font-size:var(--fs-sm)}
.profile-split{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:var(--sp-5);align-items:start}.profile-photo{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-2);min-width:0}.profile-photo>.photo-edit{flex:none}.photo-frame{width:200px;height:250px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:var(--r-lg);overflow:hidden;background:var(--gray-100);border:1px solid var(--color-border)}.photo-frame img{width:100%;height:100%;object-fit:cover;display:block}.no-photo{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);color:var(--color-text-muted);font-size:var(--fs-sm)}.no-photo svg{width:72px;height:72px;opacity:.55}.photo-drawer>summary{list-style:none}.photo-drawer>summary::-webkit-details-marker{display:none}.photo-drawer[open]::before{content:"";position:fixed;inset:0;background:rgba(15,23,42,.28);z-index:45}.photo-drawer[open] .guide-panel{transform:none}@media (max-width:719px){.profile-split{grid-template-columns:1fr}.profile-photo{order:-1}.photo-frame{width:160px;height:200px}}
.photo-block{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--sp-3)}.photo-block>.avatar{width:112px;height:112px;object-fit:cover;border-radius:var(--r-lg);font-size:var(--fs-xl)}.photo-edit{flex:1 1 280px}.avatar-md{width:160px;height:160px;object-fit:cover;border-radius:var(--r-lg)}
.table-hint{margin:0 0 var(--sp-1);font-size:var(--fs-xs);text-align:right}
/* Ngăn trượt bên phải (giống Hướng dẫn) cho chi tiết / form — trang chính giữ toàn bộ chiều rộng (góp ý 2026-10-14). */
.side-drawer,.orgchart .panel:not(:empty){position:fixed;top:var(--nav-h);right:0;bottom:0;width:min(520px,94vw);z-index:45;background:var(--color-bg);border-left:1px solid var(--color-border);box-shadow:-8px 0 24px rgba(0,0,0,.12);padding:var(--sp-3) var(--sp-4) var(--sp-6);overflow-y:auto;max-height:none}
.orgchart .panel:empty{display:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);margin:0 0 var(--sp-2);position:sticky;top:calc(-1 * var(--sp-3));background:var(--color-bg);padding:var(--sp-2) 0;z-index:1}
/* Bảng danh mục: nút Sửa chỉ hiện khi rê chuột / focus vào dòng; màn cảm ứng luôn hiện. */
.tree-d-0{padding-left:0px}.tree-d-1{padding-left:22px}.tree-d-2{padding-left:44px}.tree-d-3{padding-left:66px}.tree-d-4{padding-left:88px}.tree-d-5{padding-left:110px}.tree-d-6{padding-left:132px}.tree-d-7{padding-left:154px}.tree-d-8{padding-left:176px}.tree-cell{display:inline-flex;align-items:center;gap:6px;position:relative}.tree-toggle{width:20px;height:20px;flex:none;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface);color:var(--gray-600);cursor:pointer;padding:0;line-height:1;font-size:11px}.tree-toggle{display:inline-flex;align-items:center;justify-content:center}.tree-toggle::before{content:'';width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-3px}.tree-toggle[aria-expanded=false]::before{transform:rotate(-45deg);margin:0 0 0 -2px}.tree-toggle:hover{border-color:var(--navy-300);color:var(--color-primary)}.tree-leaf{width:20px;height:20px;flex:none;position:relative}.tree-leaf::before{content:'';position:absolute;left:9px;top:-6px;height:16px;width:9px;border-left:1.5px solid var(--gray-300);border-bottom:1.5px solid var(--gray-300);border-bottom-left-radius:4px}.tree-spacer{width:20px;flex:none}.tree-count{font-size:11px;color:var(--color-text-muted);background:var(--gray-100);border-radius:999px;padding:0 6px}tr[data-tree-anc='']>td{background:var(--gray-50)}tr[data-tree-anc='']>td:first-child .tree-label{font-weight:600}tr.tree-hidden{display:none}ul.org-nest,.org-nest ul{list-style:none;margin:0;padding:0}.org-nest li{position:relative;padding:6px 0 0}.org-nest :is(li,details)>ul{padding-left:28px}.org-nest :is(li,details)>ul>li::before{content:'';position:absolute;left:-16px;top:0;bottom:0;border-left:1.5px solid var(--gray-300)}.org-nest :is(li,details)>ul>li:last-child::before{bottom:auto;height:24px}.org-nest :is(li,details)>ul>li::after{content:'';position:absolute;left:-16px;top:24px;width:12px;border-top:1.5px solid var(--gray-300)}.org-node{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface);max-width:100%;flex-wrap:wrap}.org-nest details>summary{list-style:none;cursor:pointer}.org-nest details>summary::-webkit-details-marker{display:none}.org-nest details>summary::before{content:'';width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);margin-left:-2px;flex:none;color:var(--gray-600)}.org-nest details[open]>summary::before{transform:rotate(45deg);margin:-3px 0 0}.org-nest details>summary:hover{border-color:var(--navy-300)}.org-self{border-color:var(--color-accent);background:var(--orange-50)}.indent-1{padding-left:1.25rem}.indent-2{padding-left:2.5rem}.indent-3{padding-left:3.75rem}.indent-4{padding-left:5rem}.indent-5{padding-left:6.25rem}
.table-hover tbody tr:hover{background:var(--color-primary-soft)}
.row-actions{text-align:right;white-space:nowrap;width:1%}
@media (hover:hover){.row-actions>*{opacity:0;transition:opacity .12s}tr:hover .row-actions>*,tr:focus-within .row-actions>*{opacity:1}}
.due-danger{color:var(--red-700);font-weight:600}.due-warning{color:var(--orange-900);font-weight:600}
.bell-foot{display:flex;justify-content:space-between;gap:var(--sp-2);margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--color-border)}
.topbar .user{font-size:var(--fs-sm);opacity:.95;display:flex;align-items:center;gap:var(--sp-2);white-space:nowrap;min-width:0}
.topbar .user .name{overflow:hidden;text-overflow:ellipsis;max-width:220px}
.topbar .user .icon{width:20px;height:20px}
.topbar .btn-ghost .label{display:none}
@media (min-width:640px){.topbar .btn-ghost .label{display:inline}}
@media (max-width:639px){.topbar .user .name{display:none}}
.topbar form{margin:0}
.topbar .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.topbar .btn-ghost:hover{background:rgba(255,255,255,.12)}
.shell{display:block}
/* Mobile: một cột; desktop (≥1024): sidebar + nội dung dùng hết chiều rộng tới 1440px, canh trái (HR làm việc trên bàn). */
.page{width:100%;max-width:none;min-width:0;margin:0;padding:var(--sp-4);padding-bottom:calc(var(--bottom-nav-h) + var(--sp-6))}.app-foot{margin-top:var(--sp-6);padding-top:var(--sp-3);border-top:1px solid var(--color-border);font-size:12px;color:var(--color-text-muted);text-align:center}
.page-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.page-head h1{margin:0;flex:1 1 auto}
.page-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;height:var(--bottom-nav-h);background:var(--color-surface);border-top:1px solid var(--color-border);display:flex;z-index:20;padding-bottom:env(safe-area-inset-bottom)}
.bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:var(--fs-xs);color:var(--color-text-muted);text-decoration:none;border-top:3px solid transparent;min-height:44px}
.bottom-nav a svg{width:22px;height:22px}
.bottom-nav a.active{color:var(--color-primary);border-top-color:var(--color-accent);font-weight:600}
.sidebar{display:none}
@media (min-width:1024px){
  /* minmax(0,1fr): bảng rộng (lưới 31 ngày) cuộn trong .table-wrap, không đẩy cả trang tràn ngang. */
  .shell{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr)}
  .sidebar{display:block;position:sticky;top:var(--nav-h);height:calc(100dvh - var(--nav-h));background:var(--color-surface);border-right:1px solid var(--color-border);padding:var(--sp-4) var(--sp-3)}
  .sidebar a{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-md);color:var(--color-text);text-decoration:none;border-left:3px solid transparent;min-height:40px}
  .sidebar a svg{width:20px;height:20px;color:var(--color-text-muted)}
  .sidebar a:hover{background:var(--color-primary-soft)}
  .sidebar a.active{background:var(--color-primary-soft);border-left-color:var(--color-accent);color:var(--color-primary);font-weight:600}
  .sidebar .group{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin:var(--sp-4) var(--sp-3) var(--sp-1)}
  .bottom-nav{display:none}
  .page{padding:var(--sp-6) var(--sp-8);padding-bottom:var(--sp-8)}
  .form-row{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
  /* Form NHẬP LIỆU giữ ≤ 960px cho dễ điền; form bọc bảng (chọn nhiều, trình soạn cột) thì full width. */
  .card form.stack,.card>.card-body>form{max-width:960px}
  .card form.stack:has(table),.card>.card-body>form:has(table),form.stack:has(table){max-width:none}
  .stats{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
  .grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))}
  .kv{grid-template-columns:max-content 1fr}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:44px;padding:0 var(--sp-4);border-radius:var(--r-md);border:1px solid transparent;font:inherit;font-weight:600;font-size:var(--fs-md);line-height:1.2;white-space:nowrap;cursor:pointer;text-decoration:none;transition:background .15s,color .15s,box-shadow .15s;background:var(--gray-100);color:var(--color-text)}
.icon{width:1.25em;height:1.25em;flex:none;vertical-align:-0.25em}
.btn .icon{width:18px;height:18px}
.btn:hover{background:var(--gray-200)}
.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}
.btn-accent{background:var(--color-accent);color:#fff}.btn-accent:hover{background:var(--color-accent-hover)}
.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{background:var(--color-danger-hover)}
.btn-ghost{background:transparent;border-color:var(--color-border)}.btn-ghost:hover{background:var(--gray-100)}
.btn-sm{min-height:36px;padding:0 var(--sp-3);font-size:var(--fs-sm)}
.btn-lg{min-height:56px;font-size:var(--fs-lg);padding:0 var(--sp-6)}
.btn-block{width:100%}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.btn.htmx-request{pointer-events:none;opacity:.7}
.btn.htmx-request::after{content:"";width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Card, stat */
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:var(--sh-1);margin-bottom:var(--sp-4)}
.card-header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--color-border);font-weight:600}
.card-header .spacer{flex:1}
.card-body{padding:var(--sp-4)}
.card-footer{padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--color-border);display:flex;gap:var(--sp-2);justify-content:flex-end;flex-wrap:wrap}
.grid{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.stats{display:grid;gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.stat{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4)}
.stat-value{font-size:var(--fs-2xl);font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1;color:var(--color-primary)}
.stat-value.accent{color:var(--color-accent-hover)}.stat-value.danger{color:var(--color-danger-hover)}.stat-value.success{color:var(--color-success)}
.stat-label{font-size:var(--fs-sm);color:var(--color-text-muted)}

/* Badge */
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:var(--r-full);font-size:var(--fs-xs);font-weight:600;line-height:1.6;white-space:nowrap}
.badge-info{background:var(--navy-50);color:var(--navy-700)}
.badge-success{background:var(--color-success-soft);color:var(--color-success)}
.badge-danger{background:var(--red-50);color:var(--red-700)}
.badge-warning{background:var(--orange-50);color:var(--orange-700)}
.badge-neutral{background:var(--gray-100);color:var(--gray-700)}

/* Alert */
.alert{display:flex;gap:var(--sp-2);align-items:flex-start;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);border:1px solid;margin-bottom:var(--sp-3);font-size:var(--fs-sm)}
.alert small{display:block;margin-top:2px;opacity:.75}
.alert-error,.alert-danger{background:var(--red-50);border-color:var(--red-100);color:var(--red-900)}
.alert-success{background:var(--color-success-soft);border-color:#BBF7D0;color:#14532D}
.alert-warning{background:var(--orange-50);border-color:var(--orange-100);color:var(--orange-900)}
.alert-info{background:var(--navy-50);border-color:var(--navy-100);color:var(--navy-900)}

/* Table */
.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;max-height:calc(100dvh - var(--nav-h) - var(--sp-6));border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface)}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.table th,.table td{padding:var(--sp-2) var(--sp-3);text-align:left;border-bottom:1px solid var(--color-border);vertical-align:middle;min-height:44px}
.table th{background:var(--gray-50);color:var(--gray-700);font-weight:600;white-space:nowrap;position:sticky;top:var(--nav-h);z-index:2;box-shadow:inset 0 -1px 0 var(--color-border)}.table-wrap .table th{top:0}
.table tbody tr:hover{background:var(--navy-50)}
.table tr:last-child td{border-bottom:none}
.table .num{text-align:right}
.empty{padding:var(--sp-8) var(--sp-4);text-align:center;color:var(--color-text-muted)}

/* Form */
.field{display:flex;flex-direction:column;gap:var(--sp-1);margin-bottom:var(--sp-4)}
.field label{font-size:var(--fs-sm);font-weight:600;color:var(--gray-700)}
.row>input,.row>select,.date-slot>input,.date-slot>select,.field input,.field select,.field textarea,.inline-form input,.inline-form select,.inline-form textarea,.comment-box textarea,.popover-panel input[type=text],.popover-panel select{font:inherit;font-size:var(--fs-md);min-height:40px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface);color:var(--color-text);width:100%;transition:border-color .12s,box-shadow .12s}.row>input:focus,.row>select:focus,.date-slot>input:focus,.date-slot>select:focus,.field input:focus,.field select:focus,.field textarea:focus,.inline-form input:focus,.inline-form select:focus,.inline-form textarea:focus,.comment-box textarea:focus,.popover-panel input[type=text]:focus,.popover-panel select:focus{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent);outline:none}.field input[type=checkbox],.field input[type=radio],.popover-panel input[type=radio]{width:auto;min-height:0}
.field textarea{min-height:88px;resize:vertical}
.row>input:focus,.row>select:focus,.date-slot>input:focus,.date-slot>select:focus,.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--color-focus);outline-offset:0;border-color:var(--color-accent)}
.field .hint{font-size:var(--fs-xs);color:var(--color-text-muted)}
.field .error,.field.invalid .hint{color:var(--red-700)}
.field.invalid input,.field.invalid select{border-color:var(--red-500)}
.form-row{display:grid;gap:var(--sp-3);grid-template-columns:1fr}
@media (min-width:640px){.form-row{grid-template-columns:1fr 1fr}}
.form-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-2)}

/* Punch */
.punch{display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);padding:var(--sp-6) var(--sp-4);text-align:center}
.punch-clock{font-size:40px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--color-primary);line-height:1}
.punch-date{color:var(--color-text-muted)}
.punch-btn{min-height:72px;width:100%;max-width:360px;font-size:var(--fs-xl);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.punch-result{width:100%;max-width:360px;min-height:24px}
.punch-list{list-style:none;margin:0;padding:0;width:100%;max-width:360px}
.punch-list li{display:flex;justify-content:space-between;padding:var(--sp-2) 0;border-bottom:1px dashed var(--color-border);font-variant-numeric:tabular-nums}

/* Timesheet grid */
.ts-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.ts-day{aspect-ratio:1;border-radius:var(--r-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:var(--fs-xs);background:var(--gray-100);color:var(--gray-700);text-decoration:none;min-height:44px}
.ts-day b{font-size:var(--fs-sm)}
.ts-day.PRESENT{background:var(--color-success-soft);color:#14532D}
.ts-day.PARTIAL{background:var(--orange-50);color:var(--orange-900)}
.ts-day.ABSENT{background:var(--red-50);color:var(--red-900)}
.ts-day.ON_LEAVE{background:var(--navy-50);color:var(--navy-900)}
.ts-day.NOT_REQUIRED,.ts-day.none{background:var(--gray-50);color:var(--gray-300)}
.ts-day.flag{outline:2px solid var(--red-500);outline-offset:-2px}
.team-grid td,.team-grid th{padding:2px;text-align:center}.team-grid .sticky{position:sticky;left:0;background:var(--color-surface);text-align:left;z-index:1;min-width:12rem}
.team-grid th.weekend{color:var(--color-text-muted)}
.tg{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:var(--r-sm);text-decoration:none;font-size:var(--fs-xs);background:var(--gray-50);color:var(--gray-300)}
.tg.PRESENT{background:var(--color-success-soft);color:#14532D}.tg.PARTIAL{background:var(--orange-50);color:var(--orange-900)}
.tg.ABSENT{background:var(--red-50);color:var(--red-900)}.tg.ON_LEAVE{background:var(--navy-50);color:var(--navy-900)}
.tg.flag{outline:2px solid var(--red-500);outline-offset:-2px}
.ts-dow{text-align:center;font-size:var(--fs-xs);color:var(--color-text-muted);padding:2px 0}

/* List rows (mobile-friendly) */
.list{list-style:none;margin:0;padding:0}
.list li{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--color-border);background:var(--color-surface)}
.list li:first-child{border-radius:var(--r-md) var(--r-md) 0 0}.list li:last-child{border-bottom:none;border-radius:0 0 var(--r-md) var(--r-md)}
.list .main{flex:1;min-width:0}
.list .title{font-weight:600}
.list .sub{font-size:var(--fs-sm);color:var(--color-text-muted)}
.list .actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.list li .full{flex-basis:100%}
.grid .wide{grid-column:1/-1}
/* Trang chi tiết một thực thể: các section xếp dọc, một cột, rộng tối đa 960px để form thoải mái */
.stack-page{display:flex;flex-direction:column;gap:var(--sp-4)}
.stack-page>.card{margin-bottom:0}
/* Màn hình rộng: thẻ ngắn (class "half": liên lạc, định danh, đăng nhập, mã chấm công) xếp 2 cột; thẻ có form/bảng dài
   vẫn cả hàng (form không bị hẹp — chủ dự án 2026-10-08). dense: lấp chỗ trống khi một thẻ ngắn bị ẩn theo quyền. */
@media (min-width:1400px){
  .stack-page{display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:row dense;align-items:start}
  .stack-page>*{grid-column:1/-1}
  .stack-page>.half{grid-column:auto}
}
.list li>details.full{flex-basis:100%}
.stack{display:flex;flex-direction:column;gap:var(--sp-3)}
.row{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap}
.row>input{width:auto;flex:1 1 160px;min-height:36px}
.row>select{width:auto;min-height:36px}
.mt-2{margin-top:var(--sp-2)}.mb-2{margin-bottom:var(--sp-2)}.input-xs{width:5.5em}.mt-4{margin-top:var(--sp-4)}.mb-0{margin-bottom:0}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:var(--sp-2) var(--sp-4);margin:0}
.kv dt{color:var(--color-text-muted);font-size:var(--fs-sm)}.kv dd{margin:0;font-variant-numeric:tabular-nums}
.list.compact li{padding:var(--sp-2) var(--sp-3)}
details>summary{cursor:pointer;list-style:none}details>summary::-webkit-details-marker{display:none}
details.mt-2>summary:not(.btn){padding:var(--sp-2) 0;font-weight:600}
summary.btn{width:max-content}
code{font-size:var(--fs-sm);background:var(--gray-100);padding:0 var(--sp-1);border-radius:var(--r-sm)}
tr.muted td,li.muted{color:var(--color-text-muted)}
tr.row-danger td{background:var(--red-50)}
.guide{background:var(--color-primary-soft);border-left:3px solid var(--color-primary);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-3);margin-bottom:var(--sp-3);font-size:var(--fs-sm);color:var(--color-text)}
.guide>summary{font-weight:600;color:var(--color-primary);cursor:pointer}
.guide p{margin:var(--sp-1) 0}.guide ul{margin:var(--sp-1) 0;padding-left:var(--sp-5)}.guide li{margin:2px 0}
.guide-next{font-weight:600}.guide-section{margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--color-border)}.guide-section h3{font-size:var(--fs-md);margin:0 0 var(--sp-2)}.guide-section ol{padding-left:1.25rem;margin:0}.guide-section li{margin-bottom:var(--sp-2)}.guide-section code{word-break:break-all}.help-tip{display:inline-block;position:relative;vertical-align:middle;margin-left:4px}.help-tip>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1px solid var(--color-border);font-size:11px;font-weight:700;color:var(--color-text-muted);background:var(--color-surface)}.help-tip>summary::-webkit-details-marker{display:none}.help-tip[open]>summary{border-color:var(--color-accent);color:var(--color-accent)}.help-tip-body{position:absolute;left:0;top:calc(100% + 6px);z-index:30;width:min(300px,80vw);padding:var(--sp-2) var(--sp-3);background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:var(--sh-2);font-size:var(--fs-sm);font-weight:400;line-height:1.45;text-transform:none;letter-spacing:normal}
/* Sơ đồ tổ chức: cây + panel phải */
.orgchart{display:grid;gap:var(--sp-4);grid-template-columns:minmax(0,1fr)}.orgchart>*{min-width:0}
@media (min-width:1024px){.orgchart{grid-template-columns:minmax(0,1fr)}.panel{position:sticky;top:calc(var(--nav-h) + var(--sp-4));align-self:start;max-height:calc(100dvh - var(--nav-h) - var(--sp-6));overflow:auto}}
.tree-list{list-style:none;margin:0;padding:0 0 0 var(--sp-5);border-left:1px dashed var(--color-border)}
.tree-list.root{padding-left:0;border-left:none}
.node{margin:2px 0}
.node>details>summary,.node.node-emp{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-2);border-radius:var(--r-sm);min-height:36px}
.node>details>summary:hover,.node.node-emp:hover{background:var(--color-primary-soft)}
.node>details>summary::before{content:"▸";width:14px;color:var(--color-text-muted);font-size:12px}
.node>details[open]>summary::before{content:"▾"}
.node-kind{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);min-width:52px}
.node-link{color:var(--color-primary);text-decoration:none}.node-link:hover{text-decoration:underline}.node-link.strong{font-weight:600}
.node.inactive>details>summary{opacity:.6}
.node-actions{margin-left:auto;display:flex;gap:var(--sp-1)}
.btn-xs{min-height:28px;padding:0 var(--sp-2);font-size:var(--fs-xs)}
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-3);align-items:center}
.chip{display:inline-flex;align-items:center;min-height:32px;padding:0 var(--sp-3);border-radius:var(--r-full);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);text-decoration:none;font-size:var(--fs-sm)}
.chip.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
.chip-link{font-size:var(--fs-xs);text-decoration:underline}/* ADR-72: trình soạn mẫu email theo lịch. Không JS: chỉ ô mã HTML; có JS (.is-enhanced): vùng soạn + thanh công cụ, tab Mã HTML (.is-code). */.rem-editor{display:grid;gap:var(--sp-3)}.rem-vars{display:flex;flex-wrap:wrap;gap:var(--sp-1);align-items:center}.rem-vars .chip{min-height:28px;font-family:var(--font-mono,monospace);font-size:var(--fs-xs);cursor:pointer}.rem-tabs,.rem-toolbar,.rem-area{display:none}.rem-editor.is-enhanced .rem-tabs{display:flex}.rem-editor.is-enhanced .rem-toolbar{display:flex}.rem-editor.is-enhanced .rem-area{display:block}.rem-editor.is-enhanced .rem-code{display:none}.rem-editor.is-enhanced.is-code .rem-code{display:block}.rem-editor.is-enhanced.is-code .rem-area,.rem-editor.is-enhanced.is-code .rem-toolbar{display:none}.rem-toolbar{flex-wrap:wrap;gap:var(--sp-1);align-items:center;padding:var(--sp-1);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--gray-50)}.rem-toolbar select{min-height:32px;width:auto}.rem-color{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-sm)}.rem-color input{width:32px;height:28px;padding:0;border:0;background:none}.rem-link-box{display:flex;gap:var(--sp-2)}.rem-link-box[hidden]{display:none}.rem-link-box input{flex:1;min-width:0}.rem-area{min-height:320px;max-height:70vh;overflow:auto;padding:var(--sp-3);border:1px solid var(--color-border);border-radius:var(--r-md);background:#fff;color:#1f2937;font-family:"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.5}.rem-area:focus{outline:2px solid var(--color-primary);outline-offset:1px}.rem-area img{max-width:100%;height:auto}.rem-code{width:100%;font-family:var(--font-mono,monospace);font-size:var(--fs-sm)}.rem-image-list{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-2)}.rem-image-pick{width:88px;height:88px;padding:2px;border:1px solid var(--color-border);border-radius:var(--r-sm);background:#fff;cursor:pointer}.rem-image-pick img{width:100%;height:100%;object-fit:contain}.rem-preview{border:1px solid var(--color-border);border-radius:var(--r-md);overflow:hidden;background:var(--color-surface)}.rem-preview .alert{margin:var(--sp-2)}.rem-preview-frame{overflow:auto;max-height:80vh;background:#fff;color:#000;font-family:Arial,sans-serif;font-size:14px;line-height:normal;text-align:left}
.avatar{width:96px;height:96px;border-radius:var(--r-md);object-fit:cover;background:var(--gray-100);flex:none}
.avatar-empty{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--fs-xl);color:var(--color-primary);background:var(--color-primary-soft)}
.upload{border:1px dashed var(--color-border);border-radius:var(--r-md);padding:var(--sp-3);transition:border-color .15s,background .15s}
.upload.dragover{border-color:var(--color-accent);background:var(--color-accent-soft)}
.upload-row{display:flex;gap:var(--sp-4);align-items:flex-start;flex-wrap:wrap}
.upload-pick{position:relative;overflow:hidden;cursor:pointer}
.upload-pick input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.upload-info{font-size:var(--fs-sm)}.upload-info.error{color:var(--color-danger)}
.upload input[type=file]:not(.upload-pick input){font:inherit}
.avatar-lg{width:320px;height:320px;max-width:100%;border-radius:var(--r-lg)}
@media (max-width:479px){.avatar-lg{width:100%;height:auto;aspect-ratio:1}}
.avatar-sm{width:28px;height:28px;border-radius:50%;font-size:var(--fs-xs)}
.person{display:inline-flex;align-items:center;gap:var(--sp-2);vertical-align:middle}.avatar.avatar-xs{width:20px;height:20px;font-size:9px;border-width:1px}.person:has(.avatar-xs){gap:var(--sp-1)}
.person-photo{display:inline-flex;line-height:0}
/* Link trên header (tên tài khoản → Hồ sơ của tôi) mặc định màu navy = trùng nền: ép chữ trắng. */
.topbar a:not(.btn){color:#fff;text-decoration:none}.topbar a:not(.btn):hover{color:#fff;text-decoration:underline}
.topbar .person{font-weight:600}
.param-help{margin-top:var(--sp-1)}.param-help>summary{cursor:pointer;color:var(--color-primary);font-size:var(--fs-sm)}.param-help .kv{margin-top:var(--sp-2);font-size:var(--fs-sm)}
.topbar .person .avatar-sm{width:28px;height:28px;border:1px solid rgba(255,255,255,.4)}
.timeline li{border-left:3px solid var(--color-primary-soft);padding-left:var(--sp-3)}
/* Vùng nguy hiểm & checklist bước (DESIGN-SYSTEM §9) */
.danger-zone{border:1px solid var(--red-100);border-radius:var(--r-md);padding:var(--sp-3);background:var(--color-surface)}
.danger-zone[open]{border-color:var(--red-300);background:var(--red-50)}
.danger-zone>summary{color:var(--red-700);border-color:var(--red-300)}
.danger-body{margin-top:var(--sp-3)}
.danger-title{margin:0 0 var(--sp-1);font-weight:600;color:var(--red-700)}
.consequences{margin:0 0 var(--sp-3);padding-left:var(--sp-5);font-size:var(--fs-sm)}
.consequences li{margin:2px 0}
.steps-list{list-style:none;margin:0;padding:var(--sp-2) var(--sp-4)}
.steps-list li{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-2) 0;border-bottom:1px solid var(--color-border);color:var(--color-text-muted)}
.steps-list li:last-child{border-bottom:none}
.steps-list li.next{color:var(--color-text);font-weight:600}
.steps-list li.done{color:var(--color-text-muted);text-decoration:none}
.step-mark{flex:none;width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-xs);font-weight:700;background:var(--gray-100);color:var(--color-text-muted)}
.steps-list li.done .step-mark{background:var(--color-success-soft);color:var(--color-success)}
.steps-list li.next .step-mark{background:var(--color-accent);color:#fff}
.step-main{flex:1;display:flex;flex-direction:column;gap:2px}
.step-main .hint{font-size:var(--fs-xs);font-weight:400;color:var(--color-text-muted)}
.inline{display:inline-block;margin-left:var(--sp-2)}
.check{display:flex;gap:var(--sp-2);align-items:center}
.form-row label.check:has(.hint){align-items:flex-start;flex-wrap:wrap}.check .hint{flex-basis:100%;margin:0 0 0 1.6em;font-size:var(--fs-xs);color:var(--color-text-muted)}
.tree li.depth-1 .main{padding-left:var(--sp-4)}.tree li.depth-2 .main{padding-left:var(--sp-8)}.tree li.depth-3 .main{padding-left:48px}.tree li.depth-4 .main{padding-left:64px}
.table-dense td,.table-dense th{padding:var(--sp-1) var(--sp-2);font-size:var(--fs-xs)}.table-dense th{white-space:nowrap}/* Bảng luôn hiện đủ cột trong khung (chủ dự án 2026-10-20): ô xuống hàng, chuỗi kỹ thuật dài (mã, khoá, đường dẫn) ngắt được; số một dòng. Bảng ma trận (team-grid) giữ một dòng + cuộn ngang. */.table td code,.table td.muted,.table td .muted{overflow-wrap:anywhere}.table td.num{white-space:nowrap}.team-grid td{white-space:nowrap}
.landing{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-primary);padding:var(--sp-4)}
.landing-card{background:var(--color-surface);border-radius:var(--r-lg);padding:var(--sp-8) var(--sp-6);max-width:400px;width:100%;text-align:center;display:flex;flex-direction:column;gap:var(--sp-4);box-shadow:var(--sh-2)}
.landing-card h1{font-size:var(--fs-xl);margin:0}
.landing-card form{text-align:left}.landing-card .alert{text-align:left}
.logo.lg{display:block;width:64px;height:64px;margin:0 auto}.landing-sub{margin:0;color:var(--color-text-muted)}
/* ADR-57 Họp BOM một màn hình: hai ngăn — trái danh sách vấn đề (dính khi cuộn), phải toàn bộ vấn đề. */
.ws{display:grid;grid-template-columns:380px minmax(0,1fr);gap:var(--sp-4);align-items:start;margin-top:var(--sp-3)}
.ws-list{position:sticky;top:calc(var(--nav-h) + var(--sp-3));max-height:calc(100dvh - var(--nav-h) - var(--sp-6));overflow:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);padding:var(--sp-2)}
.ws-rows{display:flex;flex-direction:column;gap:2px}
.ws-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px var(--sp-2);align-items:start;padding:10px;border-radius:var(--r-md);border:1px solid transparent;color:var(--color-text);text-decoration:none;transition:background .1s}
.ws-row:hover{background:var(--gray-50)}.ws-row[aria-current]{background:var(--navy-50);border-color:var(--navy-100)}
.ws-row-key{color:var(--color-text-muted);font-size:var(--fs-xs);font-variant-numeric:tabular-nums;padding-top:2px;min-width:26px}
.ws-row-title{font-weight:600;font-size:15px;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.ws-row-meta{grid-column:2/4;display:flex;flex-wrap:wrap;align-items:center;gap:6px var(--sp-2);font-size:var(--fs-xs);color:var(--color-text-muted)}
.ws-row-meta .badge{font-size:11px}.ws-done{color:var(--color-success);font-weight:700}
.ws-prog{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.ws-bar{-webkit-appearance:none;appearance:none;width:44px;height:4px;border:0;border-radius:2px;background:var(--gray-100);overflow:hidden}.ws-bar::-webkit-progress-bar{background:var(--gray-100)}.ws-bar::-webkit-progress-value{background:var(--navy-500)}.ws-bar::-moz-progress-bar{background:var(--navy-500)}
.ws-late{color:var(--red-700);font-weight:600;white-space:nowrap}
.ws-sec{font-size:var(--fs-xs);font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em;padding:var(--sp-3) var(--sp-2) var(--sp-1)}
.ws-chips{display:flex;flex-wrap:wrap;gap:6px;padding:var(--sp-1) var(--sp-1) var(--sp-2)}
.ws-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--color-border);border-radius:999px;padding:3px 10px;font-size:var(--fs-xs);font-weight:600;color:var(--gray-700);text-decoration:none;transition:background .12s,border-color .12s}
.ws-chip:hover{background:var(--gray-50);border-color:var(--gray-300)}.ws-chip.active{background:var(--navy-50);border-color:var(--navy-300);color:var(--color-primary)}
.ws-chip .n{background:var(--gray-100);border-radius:999px;padding:0 6px;font-variant-numeric:tabular-nums}.ws-chip.warn .n{background:var(--red-50);color:var(--red-700)}
.ws-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--sp-2)}
.ws-stat{display:block;border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface);padding:var(--sp-2) var(--sp-3);color:inherit;text-decoration:none;transition:border-color .12s,background .12s}
.ws-stat:hover{border-color:var(--navy-300)}.ws-stat.active{background:var(--navy-50);border-color:var(--navy-300)}
.ws-stat b{display:block;font-size:var(--fs-lg);line-height:1.25}.ws-stat small{color:var(--color-text-muted);font-size:var(--fs-xs)}.ws-stat.warn b{color:var(--red-700)}
.ws-detail{min-width:0}.ws-back{display:none;margin-bottom:var(--sp-2)}
.ws-panel{display:flex;flex-direction:column;gap:var(--sp-3)}
.ws-head{display:flex;align-items:flex-start;gap:var(--sp-3)}.ws-key{color:var(--color-text-muted);font-weight:600;padding-top:8px}
.ws-title{flex:1;min-width:0;font-size:var(--fs-xl);font-weight:700;line-height:1.3}.ws-title .prop-value{padding:4px 8px;margin:0 -8px}
.ws-head-nav{display:flex;gap:var(--sp-1);flex:none}
.ws-sub{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm)}
.ws-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-5);align-items:start}
.ws-main{display:flex;flex-direction:column;gap:var(--sp-4);min-width:0}
.ws-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md)}
.ws-card>h3{display:flex;align-items:center;gap:var(--sp-2);margin:0;padding:10px var(--sp-4);border-bottom:1px solid var(--gray-100);font-size:var(--fs-sm);font-weight:700}
.ws-h-act{margin-left:auto}.ws-cbody{padding:var(--sp-3) var(--sp-4)}
.ws-concl{border-color:var(--orange-300);background:var(--orange-50)}.ws-concl>h3{color:var(--orange-900);border-color:var(--orange-100)}.ws-concl-ro{border-color:var(--color-border);background:var(--color-surface)}.ws-concl-ro>h3{color:var(--color-text)}
.ws-concl-form{display:flex;flex-direction:column;gap:var(--sp-2)}.ws-concl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2)}.ws-concl-actions .spacer{flex:1}.ws-concl-actions select{width:auto;min-width:220px}
/* Trường: nhãn + ô giá trị có khung nhẹ (rê chuột: nền trắng, viền xanh, ✎). */
.ws-fld{margin-bottom:var(--sp-3)}.ws-fld:last-child{margin-bottom:0}.ws-fld-label{font-size:var(--fs-xs);font-weight:600;color:var(--gray-700);margin-bottom:4px}
.ws-fld>.prop-value,.ws-prop-value>.prop-value{margin:0;border:1px solid var(--color-border);background:var(--gray-50);position:relative;padding:6px 30px 6px 10px;border-radius:8px;min-height:36px}
.ws-fld>.prop-value.cell-edit:hover,.ws-prop-value>.prop-value.cell-edit:hover,.ws-fld>.prop-value.cell-edit:focus,.ws-prop-value>.prop-value.cell-edit:focus{background:var(--color-surface);border-color:var(--navy-300)}
.prop-value.cell-edit::after{content:"✎";position:absolute;right:9px;top:7px;font-size:12px;color:var(--color-text-muted);opacity:0;transition:opacity .12s}.prop-value.cell-edit:hover::after,.prop-value.cell-edit:focus::after{opacity:1}
.ws-title .prop-value.cell-edit{position:relative;padding-right:30px}
.ws-fld>.prop-value.cell-editing,.ws-prop-value>.prop-value.cell-editing{background:transparent;border:0;padding:0}
.ws-ro{border:1px solid var(--color-border);background:var(--gray-50);border-radius:8px;padding:6px 10px}.ws-fld.bad .ws-ro{background:var(--red-50);border-color:var(--red-100);color:var(--red-700)}
.inline-hint{margin-right:auto;font-size:var(--fs-xs);color:var(--color-text-muted)}
/* Cột thuộc tính. */
.ws-props{display:flex;flex-direction:column;min-width:0}.ws-props>h3{display:block}.ws-grid>.ws-props{position:sticky;top:calc(var(--nav-h) + var(--sp-3))}
.ws-prop{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--sp-2);align-items:center;min-height:42px;padding:3px var(--sp-3);border-bottom:1px solid var(--gray-100)}.ws-prop:last-child{border-bottom:0}
.ws-prop-label{font-size:var(--fs-xs);color:var(--color-text-muted)}.ws-prop-value{min-width:0;font-size:var(--fs-sm)}
.ws-ro-person{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px}
/* Bộ chọn người: chồng avatar + "+" (rê chuột nổi nhẹ). */
.ws-people{display:inline-block;max-width:100%}
.ws-people-btn{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:2px 4px 2px 2px;min-height:32px;transition:background .12s;max-width:100%}
.ws-people-btn:hover{background:var(--gray-100)}.ws-people-btn .avatar-stack .mini-avatar{transition:transform .15s}.ws-people-btn:hover .avatar-stack .mini-avatar{transform:translateY(-2px)}
.ws-people-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}
.ws-add{width:24px;height:24px;flex:none;border-radius:50%;border:1.5px dashed var(--gray-300);color:var(--color-text-muted);display:inline-flex;align-items:center;justify-content:center;font-size:15px;line-height:1;transition:border-color .12s,color .12s,background .12s}
.ws-people-btn:hover .ws-add{border-color:var(--navy-500);color:var(--color-primary);background:var(--navy-50)}
.ws-pick-form{margin-top:var(--sp-2)}
/* Ô gõ bên trong ô chọn người: không viền / quầng riêng (quy tắc chung ".popover-panel input[type=text]:focus" mạnh hơn → viền đôi). Khung .combo-box là viền duy nhất. */
.popover-panel .combo-box input.combo-input,.popover-panel .combo-box input.combo-input:focus,.inline-form .combo-box input.combo-input,.inline-form .combo-box input.combo-input:focus{border:0;box-shadow:none;outline:0;min-height:32px;padding:var(--sp-1);background:transparent}
/* Việc con. */
.ws-tasks{display:flex;flex-direction:column}
.ws-task{border-bottom:1px solid var(--gray-100)}.ws-task:last-child{border-bottom:0}.ws-task.open{box-shadow:inset 3px 0 0 var(--navy-500)}.ws-task:not(.open)>.ws-tbody{display:none}
.ws-trow{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr) auto auto auto 40px;gap:var(--sp-2);align-items:center;padding:6px var(--sp-4) 6px var(--sp-3);min-height:46px}
.ws-trow::-webkit-details-marker{display:none}.ws-trow:hover{background:var(--gray-50)}
.ws-caret{color:var(--color-text-muted);transition:transform .15s;font-size:15px;line-height:1;display:inline-block;text-align:center}.ws-prop-value .progress-inline{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.ws-prop-value .progress-inline progress{width:72px}.ws-task.open .ws-caret{transform:rotate(90deg)}
.ws-ttitle{font-weight:600;overflow-wrap:anywhere}.ws-task.closed .ws-ttitle{color:var(--color-text-muted);text-decoration:line-through}
.ws-tpic{font-size:var(--fs-xs)}.ws-tdue{font-size:var(--fs-xs);color:var(--color-text-muted);text-align:right}.ws-tdue.late{color:var(--red-700);font-weight:600}
.ws-tpct{font-size:var(--fs-xs);color:var(--color-text-muted);text-align:right;font-variant-numeric:tabular-nums}
.ws-tbody{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-4);padding:var(--sp-3) var(--sp-4) var(--sp-4) 40px;background:var(--gray-50);border-top:1px solid var(--gray-100)}
.ws-tbody .ws-props{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);align-self:start}
.ws-composer{display:flex;flex-direction:column;gap:var(--sp-1);margin:var(--sp-2) 0}.ws-composer textarea,.ws-composer input[type=text]{font:inherit;font-size:var(--fs-sm);width:100%;border:1px solid var(--color-border);border-radius:8px;padding:6px 10px;background:var(--color-surface);min-height:36px}
.ws-composer textarea:focus,.ws-composer input[type=text]:focus,.ws-quick input:focus,.ws-concl-form textarea:focus{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent);outline:none}
.ws-composer-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}
.ws-more>summary{cursor:pointer;font-size:var(--fs-xs);font-weight:600;color:var(--color-text-muted);padding:var(--sp-1) 0}
.ws-tl{list-style:none;margin:0;padding:0}.ws-tl li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:var(--sp-2);padding:6px 0;font-size:var(--fs-sm)}.ws-tl-who{font-size:var(--fs-xs);color:var(--gray-700)}
.ws-quick{padding:var(--sp-2) var(--sp-3);border-top:1px solid var(--gray-100)}.ws-quick input{width:100%;font:inherit;font-size:var(--fs-sm);padding:7px 10px;border:1px dashed var(--gray-300);border-radius:8px;background:var(--color-surface)}.ws-quick input:focus{border-style:solid}
.ws-concl-form textarea{font:inherit;width:100%;border:1px solid var(--color-border);border-radius:8px;padding:8px 10px;background:var(--color-surface);min-height:80px}
/* Thanh buổi họp. */
.ws-meetbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin-top:var(--sp-2)}.ws-meetbar>form.inline{display:inline-flex;margin:0}.ws-meetbar>details.popover{display:inline-flex}.ws-meetbar .spacer{flex:1}
.ws-meetsel{font-weight:700;border:1px solid var(--color-border);border-radius:8px;padding:5px 12px;background:var(--color-surface)}
.ws-meetlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.ws-meetlist a{display:block;padding:6px 8px;border-radius:8px;text-decoration:none;color:var(--color-text)}.ws-meetlist a:hover,.ws-meetlist a[aria-current]{background:var(--navy-50)}
.ws-agenda-act{display:flex;flex-wrap:wrap;gap:2px}
/* Kết luận các buổi + PIC chữ dài trong dòng tóm tắt việc. */
.ws-ch-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.ws-ch-list li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:var(--sp-3);padding:8px 0;border-bottom:1px solid var(--gray-100);font-size:var(--fs-sm)}.ws-ch-list li:last-child{border-bottom:0}
.ws-ch-week{font-weight:700;color:var(--color-primary);line-height:1.2}.ws-ch-week small{display:block;font-weight:400;color:var(--color-text-muted);font-size:11px}.ws-ch-list li.latest .ws-ch-week{color:var(--orange-700)}
.ws-tpic{display:block;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--color-text-muted)}
/* Trường đang sửa trong cột thuộc tính hẹp → xếp dọc (nhãn trên, ô rộng hết cột). */
.ws-prop:has(.cell-editing){grid-template-columns:1fr;gap:4px;padding-top:var(--sp-2);padding-bottom:var(--sp-2)}
.ws-concl-actions select{font:inherit;font-size:var(--fs-sm);min-height:36px;padding:6px 10px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface);color:var(--color-text)}
.ws-concl-actions select:focus{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent);outline:none}
@media (max-width:1280px){.ws-grid{grid-template-columns:1fr}.ws-grid>.ws-props{position:static;order:-1}.ws-tbody{grid-template-columns:1fr}}
@media (max-width:900px){.ws{grid-template-columns:1fr}.ws-list{position:static;max-height:none}.ws.has-open .ws-list{display:none}.ws:not(.has-open) .ws-detail{display:none}.ws-back{display:inline-flex;align-self:flex-start}.ws-trow{grid-template-columns:18px minmax(0,1fr) auto auto;}.ws-trow .ws-tpeople,.ws-trow .ws-tpct{display:none}.ws-tbody{padding-left:var(--sp-3)}}
/* ADR-59: danh sách đọc (thẻ đủ thông tin trước khi bấm) + thanh công cụ Bảng việc (chip, tìm kiếm). */
.ws-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2) var(--sp-4);margin-top:var(--sp-2)}.ws-toolbar .ws-chips{padding:0}
.ws-search{display:flex;align-items:center;gap:var(--sp-2);flex:1 1 320px;max-width:560px;margin-left:auto}.ws-search .search-field{flex:1}.ws-search input{flex:1;font:inherit;font-size:var(--fs-sm);min-height:36px;padding:6px 12px;border:1px solid var(--color-border);border-radius:999px;background:var(--color-surface)}.ws-search input:focus{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent);outline:none}
.ws-result{margin:var(--sp-2) 0 0}.ws-back.always{display:inline-flex;align-self:flex-start}
.rd-list{display:flex;flex-direction:column;gap:var(--sp-3);margin-top:var(--sp-3)}
.rd-sec{display:flex;flex-direction:column;gap:var(--sp-3)}.rd-sec-title{font-size:var(--fs-sm);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);margin:var(--sp-3) 0 0}
.rd-card{display:flex;flex-direction:column;gap:6px;padding:var(--sp-3) var(--sp-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);color:var(--color-text);text-decoration:none;transition:border-color .12s,box-shadow .12s}
.rd-card:hover{border-color:var(--navy-300);box-shadow:0 2px 8px rgba(17,24,39,.06)}.rd-card.discussed{border-left:4px solid var(--color-success)}
.rd-head{display:flex;align-items:flex-start;gap:var(--sp-2)}.rd-key{color:var(--color-text-muted);font-weight:600;padding-top:2px;flex:none}
.rd-title{flex:1;min-width:0;font-size:var(--fs-md);font-weight:700;line-height:1.35;overflow-wrap:anywhere}.rd-badges{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;flex:none;max-width:45%}
.rd-by{display:flex;flex-wrap:wrap;align-items:center;gap:2px;font-size:var(--fs-xs);color:var(--color-text-muted)}
.rd-body,.rd-ask{margin:0;font-size:var(--fs-sm);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--gray-700)}
.rd-concl{font-size:var(--fs-sm);white-space:pre-wrap;overflow-wrap:anywhere;background:var(--orange-50);border-left:3px solid var(--orange-300);padding:6px 10px;border-radius:0 var(--r-sm) var(--r-sm) 0}
.rd-acts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px;font-size:var(--fs-sm)}.rd-acts li{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.rd-act{font-weight:600}
@media (max-width:640px){.rd-head{flex-wrap:wrap}.rd-badges{max-width:none;justify-content:flex-start}}
/* Hàng việc kiểu Jira: nút mở - thu + ô sửa người / trạng thái / hạn ngay trên hàng (ô sửa nổi như popup). */
.ws-trow>.ws-caret,.ws-trow>.ws-ttitle{border:0;background:none;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer}.ws-trow>.ws-caret{width:22px;height:22px;border-radius:5px}.ws-trow>.ws-caret:hover{background:var(--gray-200)}
.ws-trow>.ws-ttitle{font-weight:600;overflow-wrap:anywhere;min-width:0}.ws-trow>.ws-ttitle:hover{color:var(--color-primary)}
.ws-trow>.prop-value{display:inline-flex;align-items:center;margin:0;padding:2px 6px;min-height:28px;border:1px solid transparent;border-radius:6px;white-space:nowrap;font-size:var(--fs-xs)}.ws-trow>.prop-value.cell-edit:hover{background:var(--gray-100);border-color:var(--color-border)}.ws-trow>.prop-value.cell-edit::after{display:none}
.ws-trow>.cell-editing{position:absolute;right:var(--sp-4);top:calc(100% - 6px);z-index:40;min-width:280px;padding:10px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:0 10px 28px rgba(15,23,42,.16)}
.ws-tpeople .ws-people-btn{min-height:28px}.ws-tpeople .ws-people-name{max-width:140px;font-size:var(--fs-xs)}
.ws-activity>summary{cursor:pointer;list-style:none;padding:10px var(--sp-4);font-size:var(--fs-sm);font-weight:700}.ws-activity>summary::-webkit-details-marker{display:none}.ws-activity>summary::before{content:"▸ ";color:var(--color-text-muted)}.ws-activity[open]>summary::before{content:"▾ "}.ws-activity[open]>summary{border-bottom:1px solid var(--gray-100)}
/* Bộ chọn người phụ trách: chip VT / ĐV / BOM, nhãn Chính. */
.pic-chip{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:var(--navy-50);color:var(--color-primary);font-size:10px;font-weight:700;flex:none}
.tag-main{font-size:10px;font-weight:700;color:var(--color-primary);background:var(--navy-50);border-radius:4px;padding:1px 6px;flex:none}
.ws-pic .people-list li{gap:var(--sp-2)}.ws-pic .people-list li form{flex:none}.ws-pic select{font:inherit;font-size:var(--fs-sm);width:100%;min-height:36px;border:1px solid var(--color-border);border-radius:var(--r-md);padding:6px 10px;background:var(--color-surface)}
/* ADR-59 §B: trường tuỳ chọn — nút thêm (nét đứt) và khối "+ Thêm thông tin". */
.ws-add-fields{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.ws-add-fields>.prop-value.ws-add-field{display:inline-flex;align-items:center;width:auto;min-height:0;margin:0;padding:4px 12px;border:1px dashed var(--gray-300);border-radius:999px;background:transparent;color:var(--color-primary);font-size:var(--fs-sm);font-weight:600;cursor:pointer}.ws-add-fields>.prop-value.ws-add-field:hover{border-color:var(--navy-300);background:var(--navy-50)}.ws-add-field::after{display:none}.ws-add-fields>.cell-editing{flex-basis:100%}
.ws-more-props>summary{cursor:pointer;list-style:none;padding:8px var(--sp-3);font-size:var(--fs-xs);font-weight:600;color:var(--color-primary)}.ws-more-props>summary::-webkit-details-marker{display:none}.ws-more-props>summary:hover{background:var(--gray-50)}.ws-more-props[open]>summary{border-bottom:1px solid var(--gray-100)}
/* Cỡ chữ nội dung tab Họp BOM (máy chiếu): phóng phần dưới thanh tab, không đụng header / sidebar / thanh tab. */
.module-tabs{display:flex;align-items:flex-end}.module-tabs .zoom-ctl{margin-left:auto;display:inline-flex;align-items:center;gap:2px;padding-bottom:4px}
.zoom-ctl button{border:1px solid var(--color-border);background:var(--color-surface);border-radius:6px;min-width:30px;height:28px;padding:0 6px;font:inherit;font-size:var(--fs-xs);font-weight:700;color:var(--gray-700);cursor:pointer}.zoom-ctl button:hover{border-color:var(--navy-300);color:var(--color-primary)}.zoom-ctl .zoom-val{font-size:var(--fs-xs);color:var(--color-text-muted);min-width:38px;text-align:center}
/* Chỉ phóng nội dung quan trọng (tiêu đề, mô tả, kết luận, tên việc) — nhãn / nút / thuộc tính giữ cỡ. --bom-fs: người dùng
   chọn (app.js); --bom-present: trình chiếu to hơn mặc định. */
.rd-title,.ws-title,.ws-trow>.ws-ttitle,.ws-row-title,.rd-body,.rd-ask,.rd-concl,.rd-act,.ws-fld>.prop-value,.ws-ch-list li,.ws-concl-form textarea,.ws-concl .pre-wrap{--fsx:calc(var(--bom-fs,1) * var(--bom-present,1))}
.rd-title{font-size:calc(var(--fs-md) * var(--fsx))}.ws-title{font-size:calc(var(--fs-xl) * var(--fsx))}.ws-trow>.ws-ttitle,.ws-row-title{font-size:calc(15px * var(--fsx))}
.rd-body,.rd-ask,.rd-concl,.rd-act,.ws-ch-list li{font-size:calc(var(--fs-sm) * var(--fsx))}.ws-fld>.prop-value,.ws-concl-form textarea,.ws-concl .pre-wrap{font-size:calc(15px * var(--fsx))}
/* Trình chiếu = màn làm việc: ẩn sidebar / breadcrumb, nội dung chữ to hơn 25%. */
[data-present]{--bom-present:1.25}body:has([data-present]) .sidebar,body:has([data-present]) .breadcrumb,[data-present] .ws-back{display:none}body:has([data-present]) .shell{grid-template-columns:minmax(0,1fr)}
[data-present] .present-bar{position:sticky;top:var(--nav-h);z-index:20;background:var(--color-bg);padding:var(--sp-2) 0}
/* ADR-58: dải cảnh báo email hệ thống đang tắt / giới hạn. */
.email-mode-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3)}.email-mode-error{margin:0;padding:6px 10px;border-radius:var(--r-md);background:var(--red-50);border:1px solid var(--red-300);color:var(--red-700);font-size:var(--fs-sm);font-weight:600}
.email-mode-form:has(input[name=mode][value=SEND]:checked) .email-mode-limited,.email-mode-form:not(:has(input[name=mode][value=ALLOWLIST]:checked)) .email-mode-list{display:none}
.email-mode-banner{margin:0 0 var(--sp-3);padding:8px var(--sp-3);border-radius:var(--r-md);background:var(--orange-50);border:1px solid var(--orange-300);color:var(--orange-900);font-size:var(--fs-sm)}.email-mode-banner a{color:var(--orange-900);font-weight:600}
.htmx-indicator{display:none}.htmx-request .htmx-indicator,.htmx-request.htmx-indicator{display:inline-block}
/* Ô ngày / giờ không bao giờ đè lên ô bên cạnh trên điện thoại dọc (2026-10-19). Safari iOS cho input date/time một độ rộng
   tối thiểu riêng, bỏ qua width:100% → tràn sang cột kế bên. Ô lưới được co (min-width:0), input bỏ giao diện gốc để nhận
   đúng độ rộng ô (bấm vẫn mở bộ chọn ngày / giờ của máy), giá trị canh trái như ô chữ; khe giữa hai cột rộng hơn. */
.pair>*,.form-row>*,.date-slot>*,.date-range>*{min-width:0}
input[type=date],input[type=time],input[type=datetime-local],input[type=month]{min-width:0;max-width:100%}
input::-webkit-date-and-time-value{text-align:left;min-width:0}
@supports (-webkit-touch-callout:none){.field input[type=date],.field input[type=time],.date-slot>input[type=date]{-webkit-appearance:none;appearance:none;display:block}}
@media (max-width:639px){.pair{column-gap:var(--sp-3)}.date-slot{gap:var(--sp-2)}.field input[type=date],.field input[type=time],.date-slot>input[type=date]{padding-left:var(--sp-2);padding-right:var(--sp-2)}}/* Máy rất hẹp (≤ 359px, vd iPhone SE đời đầu): một cột / buổi xuống dòng thay vì cắt chữ ngày. */.table tr.table-group>th{background:var(--gray-50);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);text-align:left}/* ADR-64 tài sản: quét mã + tem in A4 / A5 (trang in riêng .lbl-body, @page có tên theo khổ). */.scan{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-3)}.scan-msg{margin:0;max-width:60ch}.scan-msg.is-error{color:var(--red-900);background:var(--red-50);border:1px solid var(--red-300);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3)}.scan-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}.scan-view{position:relative;width:100%;max-width:520px;border-radius:var(--r-md);overflow:hidden;background:#000}.scan-view[hidden]{display:none}.scan-video{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.scan-box{position:absolute;left:10%;right:10%;top:15%;bottom:15%;border:3px solid rgba(255,255,255,.95);border-radius:12px;box-shadow:0 0 0 2000px rgba(0,0,0,.28);pointer-events:none}.scan-diag{font-size:var(--fs-xs);margin:0}.scan-diag[hidden]{display:none}.scan-log{list-style:none;margin:0;padding:0;width:100%;max-width:520px;display:flex;flex-direction:column;gap:4px}.scan-hit{font-size:var(--fs-sm);padding:6px var(--sp-3);border-radius:var(--r-md);border:1px solid var(--color-border);background:var(--color-surface)}.scan-hit.is-found{border-color:var(--color-success);background:var(--color-success-soft)}.scan-hit.is-misplaced,.scan-hit.is-unknown{border-color:var(--orange-300);background:var(--orange-50)}.scan-hit.is-error{border-color:var(--red-300);background:var(--red-50)}.scan-hit.is-duplicate{color:var(--color-text-muted)}.audit-stats{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);margin:0 0 var(--sp-3)}
/* Kiểm kê: phần ghi thêm của dòng đã quét (tóm tắt + nút; form tại chỗ trong nhật ký quét / bảng). */
.scan-view.is-paused .scan-video{opacity:.35;filter:grayscale(1)}
/* Bảng danh mục (khoản chi, nhóm tờ trình): mã dạng nhãn, dòng ẩn mờ, dòng đang sửa nổi bật, form sửa tại dòng một hàng. */
.code-pill{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--gray-50);border:1px solid var(--color-border);font-size:var(--fs-xs);letter-spacing:.02em}
.catalog-table tbody tr.row-muted td{color:var(--color-text-muted)}.catalog-table tbody tr.row-muted b{font-weight:500}
.catalog-table tr.row-editing>td{background:var(--orange-50);padding:var(--sp-3)}
.catalog-table .row-actions>*{opacity:1}.catalog-name{background:none;border:0;padding:0;font:inherit;font-weight:600;color:inherit;cursor:pointer;text-align:left}.catalog-name:hover{color:var(--color-primary);text-decoration:underline}
.catalog-edit{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--sp-2) var(--sp-3)}
.catalog-field{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-sm);min-width:9rem}.catalog-field>span{font-weight:600;font-size:var(--fs-xs);color:var(--color-text-muted)}
.catalog-field-grow{flex:1 1 16rem}.catalog-field-num{min-width:0;width:6rem}.catalog-field input[readonly]{background:var(--gray-50);color:var(--color-text-muted)}
.catalog-edit-actions{display:flex;gap:var(--sp-2)}.catalog-edit-full{flex-basis:100%;margin:0}
.stat-strip{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-5);margin:0 0 var(--sp-3);font-size:var(--fs-sm);color:var(--color-text-muted)}.stat-strip b{color:var(--color-text);font-size:var(--fs-md, 1rem)}
/* ADR-67: (i) giá trị hiện tại cạnh giá trị lúc xảy ra. */
.asof-info{display:inline-block;position:relative;margin-left:4px;vertical-align:middle}.asof-info>summary{list-style:none;cursor:pointer;width:16px;height:16px;border-radius:50%;border:1px solid var(--color-border);color:var(--color-text-muted);font:italic 600 11px/14px Georgia,serif;text-align:center;user-select:none}.asof-info>summary::-webkit-details-marker{display:none}.asof-info>summary:hover,.asof-info[open]>summary{color:var(--color-primary);border-color:var(--color-primary)}
.asof-now{position:absolute;z-index:20;left:0;top:calc(100% + 4px);white-space:nowrap;padding:6px 8px;border-radius:var(--r-sm);background:var(--gray-900);color:#fff;font-size:var(--fs-xs);font-weight:400;box-shadow:0 4px 14px rgba(0,0,0,.2)}.asof-now b{color:#fff}
.audit-detail{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1) var(--sp-2);margin-top:4px}
.audit-detail-form{margin-top:var(--sp-2);padding:var(--sp-2);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface)}
.audit-detail-form input[type=text],.audit-detail-form input:not([type]){width:100%}.audit-stats b{font-size:var(--fs-lg)}.my-asset .title{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center}.lbl-body{background:var(--gray-100);margin:0;padding:var(--sp-4) 0}.lbl-toolbar{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;max-width:210mm;margin:0 auto var(--sp-4);padding:0 var(--sp-3)}.lbl-empty{text-align:center}@page lbl-a4{size:A4;margin:0}@page lbl-a5{size:A5;margin:0}.lbl-sheet{display:grid;background:#fff;margin:0 auto var(--sp-4);box-shadow:var(--sh-2);overflow:hidden;break-after:page}.lbl-a4-21{page:lbl-a4;width:210mm;height:297mm;padding:13mm 7mm;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(7,1fr);column-gap:3mm}.lbl-a4-12{page:lbl-a4;width:210mm;height:297mm;padding:12mm 8mm;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:4mm}.lbl-a5-10{page:lbl-a5;width:148mm;height:210mm;padding:10mm 6mm;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);gap:3mm}.lbl{display:flex;align-items:center;gap:2.5mm;padding:2mm;border:1px dashed var(--gray-300);min-width:0;min-height:0;overflow:hidden;color:#000}.lbl-qr{flex:none;height:100%;max-height:34mm;aspect-ratio:1;display:flex}.lbl-qr svg{width:100%;height:100%}.lbl-a4-12 .lbl{flex-direction:column;justify-content:center;text-align:center}.lbl-a4-12 .lbl-qr{height:auto;width:60%;max-height:none}.lbl-text{display:flex;flex-direction:column;gap:1mm;min-width:0}.lbl-code{font-size:11pt;letter-spacing:.02em}.lbl-name{font-size:8pt;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.lbl-org{font-size:7pt;color:#444}@media print{.no-print{display:none!important}.lbl-body{background:#fff;padding:0}.lbl-sheet{margin:0;box-shadow:none}.lbl{border-color:transparent}}/* ADR-65 phiếu đề nghị chi (trang in riêng .doc-body, A4). */.doc-body{background:var(--gray-100);margin:0;padding:var(--sp-4) var(--sp-3)}.doc-toolbar{display:flex;gap:var(--sp-2);max-width:210mm;margin:0 auto var(--sp-3)}.doc-sheet{background:#fff;color:#000;max-width:210mm;margin:0 auto;padding:14mm 14mm 12mm;box-shadow:var(--sh-2)}.doc-head{display:flex;justify-content:space-between;gap:var(--sp-4);align-items:flex-start;margin-bottom:var(--sp-3)}.doc-head h1{font-size:20px;margin:var(--sp-1) 0}.doc-qr{width:26mm;flex:none}.doc-qr svg{width:100%;height:auto}.doc-sheet h2{font-size:15px;margin:var(--sp-4) 0 var(--sp-2)}.doc-table{width:100%;margin:var(--sp-2) 0}.doc-table th,.doc-table td{color:#000}.doc-foot{font-size:11px;margin-top:var(--sp-4);word-break:break-all}.doc-signs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4);margin-top:var(--sp-5);text-align:center;break-inside:avoid}.doc-signs .sig{height:22mm}@page{size:A4}@media print{.doc-body{background:#fff;padding:0}.doc-sheet{box-shadow:none;padding:0;max-width:none}}.cell-input.num{text-align:right;min-width:5rem}.cell-input{font:inherit;font-size:var(--fs-sm);min-height:36px;padding:4px var(--sp-2);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface);color:var(--color-text);width:100%;min-width:8rem}.cell-input:focus{border-color:var(--color-accent);outline:2px solid var(--color-focus);outline-offset:0}.stat-label-short{display:none}/* Bảng công trên điện thoại (2026-10-19): 5 chỉ số một hàng nhỏ gọn, nhãn ngắn → lịch tháng vừa một màn hình. */@media (max-width:639px){.stats-compact{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.stats-compact .stat{padding:6px 2px;text-align:center;min-width:0}.stats-compact .stat-value{font-size:var(--fs-md);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stats-compact .stat-label{font-size:10.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stats-compact .stat-label-long{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.stats-compact .stat-label-short{display:inline}}/* ADR-77 §2.9 phiếu mật khẩu tạm: A4, 2 cột, cắt rời. */.slip-sheet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6mm;max-width:210mm;margin:0 auto;background:#fff;color:#000;padding:10mm}.slip{border:1px dashed #888;padding:5mm;break-inside:avoid;font-size:10pt}.slip .kv{margin:2mm 0}.slip-name{font-weight:700;font-size:12pt;margin:1mm 0}.slip-pw{font-size:13pt;letter-spacing:.05em}.slip-note{font-size:8.5pt}@media print{.slip-sheet{padding:0;max-width:none}}@media (max-width:639px){.slip-sheet{grid-template-columns:minmax(0,1fr)}}/* ADR-87 xác thực hai lớp: QR + mã khôi phục. */.mfa-qr{width:200px;max-width:100%;background:#fff;padding:8px;border-radius:var(--r-md);border:1px solid var(--color-border)}.mfa-qr svg{width:100%;height:auto;display:block}/* ADR-91 lát 91c màn hình QR tại quầy (máy tính bảng, toàn màn hình). */.kiosk-body{margin:0;min-height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--color-primary);color:#fff;font-family:inherit}.kiosk{text-align:center;padding:var(--sp-4);max-width:720px;width:100%}.kiosk h1{font-size:clamp(20px,4vw,32px);margin:0 0 var(--sp-1)}.kiosk-sub{opacity:.85;margin:0 0 var(--sp-3)}.kiosk-qr{background:#fff;border-radius:16px;padding:16px;width:min(70vmin,520px);margin:0 auto}.kiosk-qr svg{width:100%;height:auto;display:block}.kiosk-clock{font-size:clamp(28px,6vw,56px);font-weight:700;margin:var(--sp-3) 0 0;font-variant-numeric:tabular-nums}.kiosk-hint{opacity:.9;margin:var(--sp-2) 0 0}.kiosk-off{background:var(--orange-50);color:var(--orange-900);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);margin-top:var(--sp-3)}.kiosk-body.kiosk-stale .kiosk-qr{opacity:.25}/* ADR-90 tờ mã QR tham gia. */.join-poster{text-align:center}.join-poster h1{font-size:24px;margin:var(--sp-2) 0}.join-poster ol{text-align:left;max-width:120mm;margin:var(--sp-4) auto}.join-poster code{word-break:break-all}.join-qr{width:110mm;max-width:100%;margin:var(--sp-3) auto}.join-qr svg{width:100%;height:auto;display:block}.mfa-secret{font-family:ui-monospace,monospace;word-break:break-all;letter-spacing:.05em}.recovery-codes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2);font-family:ui-monospace,monospace;font-size:var(--fs-md);list-style:none;padding:0;margin:var(--sp-3) 0}@media (max-width:359px){.pair{grid-template-columns:minmax(0,1fr)}.date-slot{grid-template-columns:auto minmax(0,1fr)}.date-slot>select{grid-column:2}}
/* ADR-73 lát 2: trang soát CV — form trái, CV phải (desktop); điện thoại: form trên, CV dưới. Ô vàng = máy đoán, xanh = HR điền. */
.cv-review{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);gap:var(--sp-4);align-items:start}
.cv-review-form{position:sticky;top:calc(var(--nav-h) + var(--sp-2));max-height:calc(100vh - var(--nav-h) - var(--sp-4));overflow:auto}
.cv-viewer{background:var(--gray-700);border-radius:var(--r-md);padding:var(--sp-3);min-height:60vh;max-height:calc(100vh - var(--nav-h) - var(--sp-4));overflow:auto}
.cv-viewer img{display:block;max-width:100%;margin:0 auto;background:#fff}
.cv-doctext{background:#fff;color:#000;padding:var(--sp-5);white-space:pre-wrap;max-width:800px;margin:0 auto;line-height:1.5;user-select:text}
.cv-note{background:#fff;padding:var(--sp-3) var(--sp-4);margin:0 auto var(--sp-3);max-width:800px;border-left:4px solid var(--color-accent)}
.cv-page{position:relative;margin:0 auto var(--sp-3);background:#fff;box-shadow:var(--sh-2)}.cv-page canvas{display:block}
.field.cv-guess input,.field.cv-guess textarea,.field.cv-guess select{background:#FFF6CC;border-color:#E0B400}
.field.cv-filled input,.field.cv-filled textarea,.field.cv-filled select{background:var(--color-success-soft)}
.cv-ai{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);margin:0 0 var(--sp-3)}
.cv-confirm{border-top:1px solid var(--color-border);padding-top:var(--sp-3)}
.cv-dups{border:1px solid var(--color-accent);background:var(--color-accent-soft);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-1)}
.cv-dups legend{font-size:var(--fs-sm);font-weight:600;padding:0 var(--sp-1)}
.cv-legend{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);font-size:var(--fs-xs);color:var(--color-text-muted);margin:0 0 var(--sp-3)}
.cv-legend i{display:inline-block;width:12px;height:12px;border-radius:3px;border:1px solid var(--color-border);vertical-align:-2px;margin-right:4px}
.cv-legend .g{background:#FFF6CC;border-color:#E0B400}.cv-legend .f{background:var(--color-success-soft)}
.cv-pick{position:fixed;z-index:30;display:flex;flex-wrap:wrap;gap:4px;max-width:430px;padding:4px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-md);box-shadow:var(--sh-2)}
.cv-pick[hidden]{display:none}.cv-pick button{font:inherit;font-size:var(--fs-xs);padding:4px 8px;border:1px solid var(--color-border);border-radius:var(--r-sm);background:var(--gray-50);cursor:pointer}.cv-pick button:hover{background:var(--color-primary-soft)}
@media (max-width:899px){.cv-review{grid-template-columns:minmax(0,1fr)}.cv-review-form{position:static;max-height:none}.cv-viewer{max-height:none}}
/* pdf.js textLayer (rút gọn từ pdfjs-dist/web/pdf_viewer.css) */
.textLayer{position:absolute;inset:0;overflow:clip;opacity:1;line-height:1;text-align:initial;transform-origin:0 0;z-index:0;--min-font-size:1;--text-scale-factor:calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv:calc(1 / var(--min-font-size))}
.textLayer :is(span,br){color:transparent;position:absolute;white-space:pre;cursor:text;transform-origin:0% 0%;user-select:text}
.textLayer > :not(.markedContent),.textLayer .markedContent span:not(.markedContent){z-index:1;--font-height:0;font-size:calc(var(--text-scale-factor) * var(--font-height));--scale-x:1;--rotate:0deg;transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}
.textLayer .markedContent{display:contents}.textLayer ::selection{background:rgba(0,90,255,.3);color:transparent}
.textLayer .endOfContent{display:block;position:absolute;inset:100% 0 0;z-index:0;cursor:default;user-select:none}
.tree-cell{overflow-wrap:normal}.tree-cell>.tree-label{min-width:min(8rem,36vw)}
@media (max-width:1023px){
.table-wrap{max-height:none;overflow-x:auto;overflow-y:hidden}
.photo-log,.people-list{max-height:none;overflow:visible}
:where(.table-wrap>.table:has(tr>:nth-child(5))) td{min-width:7rem}
:where(.table-wrap>.table:has(tr>:nth-child(5))) td:is(.num,.col-check,.row-actions,[colspan]){min-width:0}
:where(.table-wrap>.table:has(tr>:nth-child(5))) td:is(.col-key,:has(>.person)){min-width:min(11rem,40vw)}
:where(.table-wrap>.table:not(.team-grid)) tr>.col-check:first-child,:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>:first-child:not(.col-check):not([colspan]),:where(.table-wrap>.table:not(.team-grid)) tr>.col-key,:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>.col-check:first-child+:not([colspan]),:where(.table-wrap>.table:not(.team-grid)) tr>.col-check+.col-key{position:sticky;left:0;z-index:1;background:var(--color-surface);box-shadow:inset -1px 0 0 var(--color-border)}
:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>:first-child:not(.col-check):not([colspan]),:where(.table-wrap>.table:not(.team-grid)) tr>.col-key,:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>.col-check:first-child+:not([colspan]),:where(.table-wrap>.table:not(.team-grid)) tr>.col-check+.col-key{max-width:45vw;overflow-wrap:anywhere}
:where(.table-wrap>.table:not(.team-grid)) tr>.col-check:first-child{width:2.5rem;min-width:2.5rem;max-width:2.5rem;padding-left:0;padding-right:0;text-align:center;box-shadow:none}
:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>.col-check:first-child+:not([colspan]),:where(.table-wrap>.table:not(.team-grid)) tr>.col-check+.col-key{left:2.5rem}
:where(.table-wrap>.table:not(.team-grid)) tr>.col-check:first-child:is(th),:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>:first-child:not(.col-check):not([colspan]):is(th),:where(.table-wrap>.table:not(.team-grid)) tr>.col-key:is(th),:where(.table-wrap>.table:not(.team-grid):not(:has(.col-key))) tr>.col-check:first-child+:not([colspan]):is(th),:where(.table-wrap>.table:not(.team-grid)) tr>.col-check+.col-key:is(th){z-index:4;background:var(--gray-50)}
.tree-d-1{padding-left:10px}.tree-d-2{padding-left:20px}.tree-d-3{padding-left:30px}.tree-d-4,.tree-d-5,.tree-d-6,.tree-d-7,.tree-d-8{padding-left:40px}
.tree-cell>.tree-label{min-width:6.5rem}
.table-wrap>.table td:has(>.tree-cell){max-width:none}
.org-nest :is(li,details)>ul{padding-left:16px}.org-nest :is(li,details)>ul>li::before,.org-nest :is(li,details)>ul>li::after{left:-10px}.org-nest :is(li,details)>ul>li::after{width:8px}
}
form.is-submitting :is(button[type=submit],button:not([type])){opacity:.6;cursor:progress}.filter-more{display:none}.filter-count{display:inline-block;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--color-accent);color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center}
@media (max-width:1023px){
.filter-bar:has(>.filter-more){flex-wrap:wrap}
.filter-bar:has(>.filter-more)>.search-field{flex:1 1 60%;min-width:0;max-width:none}
.filter-bar:has(>.filter-more):not(.is-open)>:not(.search-field):not(.filter-more):not(.filter-keep){display:none}
.filter-bar>.filter-more{display:inline-flex;align-items:center;gap:var(--sp-1);flex:none}
.filter-bar:has(>.search-field)>.filter-more .filter-more-text{display:none}
.filter-bar.is-open>.filter-more{background:var(--color-primary-soft);border-color:var(--color-primary)}
.filter-bar.is-open>:is(select,input[type=date],input[type=month]){flex:1 1 calc(50% - var(--sp-2));min-width:0}
}

.bell{--pop-gap:6px;--pop-z:61}
details.popover{--pop-gap:6px;--pop-z:71}
.oc-warn{--pop-gap:4px;--pop-z:21}
.asof-info{--pop-gap:4px;--pop-z:21;--pop-bg:var(--gray-900);--pop-bd:var(--gray-900)}
.bell[open]>summary::after,details.popover[open]>summary::after,.oc-warn[open]>summary::after,.asof-info[open]>summary::after{content:"";position:absolute;left:50%;top:calc(100% + var(--pop-gap) - 5px);width:10px;height:10px;margin-left:-5px;box-sizing:border-box;transform:rotate(45deg);background:var(--pop-bg,var(--color-surface));border:1px solid var(--pop-bd,var(--color-border));border-right-color:transparent;border-bottom-color:transparent;z-index:var(--pop-z);pointer-events:none}
details.popover[open][data-flip=up]>summary::after{top:auto;bottom:calc(100% + var(--pop-gap) - 5px);border-color:var(--pop-bd,var(--color-border));border-left-color:transparent;border-top-color:transparent}
@media (max-width:640px){.bell{--pop-gap:calc(var(--nav-h) / 2 - 16px)}}
.cc-tip[data-tip]:hover::before,.cc-tip[data-tip]:focus-visible::before{content:"";position:absolute;left:50%;bottom:calc(100% + 1px);margin-left:-5px;border:5px solid transparent;border-top-color:var(--gray-900);z-index:30;pointer-events:none}
.copy-btn.copied::before{content:"";position:absolute;left:calc(100% - 6px);top:50%;margin-top:-5px;border:5px solid transparent;border-right-color:var(--color-success);z-index:5;pointer-events:none}

.ProseMirror{position:relative;word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;font-variant-ligatures:none;outline:none}.ProseMirror [contenteditable=false]{white-space:normal}.ProseMirror-hideselection *::selection{background:transparent}.ProseMirror-hideselection *{caret-color:transparent}.ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}.ProseMirror-gapcursor:after{content:"";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid var(--color-text)}.ProseMirror-focused .ProseMirror-gapcursor{display:block}img.ProseMirror-separator{display:inline;border:none;margin:0;width:0;height:0}.ProseMirror .selectedCell:after{content:"";position:absolute;inset:0;background:rgba(17,54,127,.12);pointer-events:none}.ProseMirror p.is-editor-empty:first-child::before{content:attr(data-placeholder);color:var(--color-text-muted);float:left;height:0;pointer-events:none}
.rich{border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface)}.rich:not(.is-enhanced){border:0;background:transparent}.rich:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent)}.rich-toolbar{display:flex;flex-wrap:wrap;gap:2px;padding:4px;border-bottom:1px solid var(--color-border);background:var(--gray-50);border-radius:var(--r-md) var(--r-md) 0 0;position:sticky;top:0;z-index:5}.rich-btn{min-width:32px;height:32px;padding:0 8px;border:1px solid transparent;border-radius:var(--r-sm);background:transparent;color:var(--color-text);font:inherit;font-size:var(--fs-sm);font-weight:600;cursor:pointer}.rich-btn:hover{background:var(--gray-100)}.rich-btn.active{background:var(--color-primary-soft);color:var(--color-primary);border-color:var(--color-primary-soft)}.rich-btn:focus-visible{outline:2px solid var(--color-focus);outline-offset:1px}.rich-sep{width:1px;margin:4px 2px;background:var(--color-border)}.rich-link-row{display:flex;gap:var(--sp-1);padding:var(--sp-2);border-bottom:1px solid var(--color-border)}.rich-link-row input{flex:1;min-height:36px;padding:0 var(--sp-2);border:1px solid var(--color-border);border-radius:var(--r-sm);font:inherit}.rich-area .ProseMirror{min-height:160px;max-height:70vh;overflow-y:auto;padding:var(--sp-3)}.rich-status{padding:0 var(--sp-3) var(--sp-2);min-height:1em}
.rich-content{line-height:1.6;overflow-wrap:anywhere}.rich-content>:first-child{margin-top:0}.rich-content>:last-child{margin-bottom:0}.rich-content p{margin:0 0 .6em}.rich-content h2{font-size:1.25rem;margin:1.1em 0 .4em}.rich-content h3{font-size:1.1rem;margin:1em 0 .4em}.rich-content h4{font-size:1rem;margin:.9em 0 .3em}.rich-content ul,.rich-content ol{margin:0 0 .6em;padding-left:1.5em}.rich-content li>p{margin:0}.rich-content ul[data-type=taskList]{list-style:none;padding-left:.2em}.rich-content ul[data-type=taskList] li{display:flex;gap:.5em;align-items:flex-start}.rich-content ul[data-type=taskList] li>label{flex:none;margin-top:.15em}.rich-content ul[data-type=taskList] li>div{flex:1}.rich-content li[data-checked=true]>div{color:var(--color-text-muted);text-decoration:line-through}.rich-content blockquote{margin:0 0 .6em;padding:.2em 0 .2em 1em;border-left:3px solid var(--orange-300);color:var(--gray-700)}.rich-content hr{border:0;border-top:1px solid var(--color-border);margin:1em 0}.rich-content a{color:var(--color-link,var(--color-primary));text-decoration:underline}.rich-content img{max-width:100%;height:auto;border-radius:var(--r-sm);vertical-align:middle}.rich-content img.ProseMirror-selectednode{outline:3px solid var(--color-accent)}.rich-content table{border-collapse:collapse;margin:0 0 .8em;width:100%;table-layout:auto;display:block;overflow-x:auto}.rich-content th,.rich-content td{border:1px solid var(--color-border);padding:6px 8px;vertical-align:top;min-width:60px;position:relative}.rich-content th{background:var(--gray-50);font-weight:600;text-align:left}.rich-content a.file-chip{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border:1px solid var(--color-border);border-radius:var(--r-full);background:var(--gray-50);color:var(--color-text);text-decoration:none;font-size:var(--fs-sm)}.rich-content a.file-chip::before{content:"📎"}.rich-content a.file-chip.ProseMirror-selectednode{outline:2px solid var(--color-accent)}
.diff{font-size:var(--fs-sm);line-height:1.55;border:1px solid var(--color-border);border-radius:var(--r-md);overflow:hidden}.diff-row{display:grid;grid-template-columns:1.4em 1fr auto;gap:var(--sp-2);padding:4px var(--sp-2);border-left:3px solid transparent;overflow-wrap:anywhere}.diff>*+*{border-top:1px solid var(--gray-100)}.diff .mk{color:var(--color-text-muted);font-weight:700;text-align:center}.diff-row.del,.diff-pair.del .cell:first-child{background:var(--red-50);border-left-color:var(--red-500)}.diff-row.ins,.diff-pair.ins .cell:last-child{background:var(--color-success-soft);border-left-color:var(--color-success)}.diff-row.mod,.diff-pair.mod .cell{background:var(--orange-50);border-left-color:var(--orange-500)}.diff del{background:var(--red-100);color:var(--red-900);text-decoration:line-through}.diff ins{background:#BBF7D0;color:#14532D;text-decoration:none}.diff-row.del>span:nth-child(2),.diff-pair.del .cell:first-child{text-decoration:line-through;color:var(--red-900)}.diff-skip{padding:4px var(--sp-2);color:var(--color-text-muted);font-style:italic;text-align:center;background:var(--gray-50)}.diff-pair{display:grid;grid-template-columns:1fr 1fr}.diff-pair .cell{padding:4px var(--sp-2);border-left:3px solid transparent;overflow-wrap:anywhere;min-width:0}.diff-pair .cell+.cell{box-shadow:inset 1px 0 0 var(--color-border)}.diff-pair .cell.empty{background:var(--gray-50)}.diff-head{border:1px solid var(--color-border);border-bottom:0;border-radius:var(--r-md) var(--r-md) 0 0}.diff-head .cell{font-weight:600;background:var(--gray-50)}.diff-nav-mini{display:inline-flex;gap:4px;margin-left:var(--sp-2);float:right}.diff-nav-mini a{text-decoration:none;padding:0 4px;border-radius:var(--r-sm)}.diff-nav-mini a:hover{background:var(--gray-100)}.diff-bar{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);align-items:center;margin:var(--sp-2) 0}.diff-switch{margin-left:auto}.diff-switch a[aria-current]{font-weight:700;text-decoration:none;color:var(--color-text)}.diff-count.ins{color:var(--color-success)}.diff-count.del{color:var(--color-danger)}.diff-count.mod{color:var(--orange-900)}[id^=chg-]{scroll-margin-top:84px}@media (max-width:640px){.diff-pair{grid-template-columns:1fr}.diff-pair .cell+.cell{box-shadow:inset 0 1px 0 var(--color-border)}.diff-switch{margin-left:0}}

@font-face{font-family:Geist;src:url(/assets/fonts/geist.woff2?v=64f4451fca) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/assets/fonts/geist-mono.woff2?v=64f4451fca) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
body{letter-spacing:-.006em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01"}
h1{font-size:var(--fs-xl);font-weight:800;letter-spacing:-.035em}h2{font-weight:700;letter-spacing:-.02em}h3{font-weight:700;letter-spacing:-.01em}
.num,.mono,.stat-value,.punch-clock,.count-badge,.ts-day b{font-family:var(--font-mono);letter-spacing:-.02em}
a{text-underline-offset:3px;transition:color var(--t) var(--ease)}
::selection{background:var(--orange-100);color:var(--gray-900)}
@media (prefers-reduced-motion:no-preference){
.btn,.chip,.card,.stat,.dir-card,.list li,.sidebar a,.bottom-nav a,.table tbody tr,.tabs .tab,.nav-group>summary,.flow-step,.issue-panel,.ts-day,.tg,.ts-mini,.field input,.field select,.field textarea,.bell>summary,.topbar .help-link{transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease),color var(--t) var(--ease)}
}

/* Khung: thanh trên trắng, kẻ mảnh, mờ nền khi cuộn */
.topbar{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);color:var(--color-text);box-shadow:inset 0 -1px 0 var(--color-border)}
.topbar .brand,.topbar .brand-name{color:var(--color-text);font-weight:800;letter-spacing:-.04em}
.topbar a:not(.btn){color:var(--color-text)}.topbar a:not(.btn):hover{color:var(--color-primary);text-decoration:none}
.topbar .bell>summary,.topbar .help-link{color:var(--gray-700);border-radius:var(--r-full)}
.topbar .bell>summary:hover,.topbar .help-link:hover,.topbar .bell[open]>summary{background:var(--gray-100);color:var(--color-primary)}
.topbar .btn-ghost{color:var(--gray-700);border-color:var(--color-border)}.topbar .btn-ghost:hover{background:var(--gray-100);color:var(--color-text)}
.topbar .user a{color:var(--color-text)}
.topbar .env-badge{background:var(--color-accent);color:var(--color-on-accent)}
.count-dot{background:var(--color-hot);box-shadow:0 0 0 2px var(--color-surface)}
.count-badge{background:var(--color-accent);color:var(--color-on-accent);font-weight:700}
.topbar .plan-free>summary{color:var(--orange-700);background:var(--orange-50);box-shadow:inset 0 0 0 1px var(--orange-300)}
.topbar .plan-free>summary:hover,.topbar .plan-free[open]>summary{background:var(--orange-100);box-shadow:inset 0 0 0 1px var(--orange-500),var(--glow-accent)}

/* Thanh trái: mục = lớp 1 (nền + vạch cam khi rê; đang mở = chữ navy đậm + vạch cam) */
@media (min-width:1024px){
.sidebar{background:var(--color-surface);padding:var(--sp-4) var(--sp-3)}
.sidebar a{color:var(--gray-700);font-weight:500;border-left:0;position:relative;border-radius:var(--r-md)}
.sidebar a svg{color:var(--gray-500)}
.sidebar a:hover{background:var(--gray-50);color:var(--color-text);transform:translateX(2px)}
.sidebar a:hover svg{color:var(--color-primary)}
.sidebar a.active{background:var(--navy-50);color:var(--color-primary);font-weight:700}
.sidebar a.active svg{color:var(--color-primary)}
.sidebar a.active::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--color-accent)}
}
.nav-group>summary{font-weight:600;color:var(--gray-500)}
.nav-group>summary:hover{background:var(--gray-50);color:var(--color-text)}

/* Nút = lớp 3: viên thuốc; rê → sáng hơn + bóng cùng tông + nhấc 1px; bấm → nén */
.btn{border-radius:var(--r-full);min-height:36px;padding:0 var(--sp-4);font-size:var(--fs-sm);font-weight:600;letter-spacing:-.005em;background:var(--gray-100);color:var(--color-text);border-color:transparent}
.btn:hover{background:var(--gray-200);transform:translateY(-1px);box-shadow:var(--sh-2)}
.btn:active{transform:scale(.97);box-shadow:none}
.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover);color:#fff;box-shadow:var(--glow-primary)}
.btn-accent{background:var(--color-accent);color:var(--color-on-accent)}.btn-accent:hover{background:var(--color-accent-hover);color:var(--color-on-accent);box-shadow:var(--glow-accent)}
.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover{background:var(--color-danger-hover);color:#fff;box-shadow:var(--glow-danger)}
.btn-ghost{background:transparent;border-color:var(--color-border);color:var(--color-text)}.btn-ghost:hover{background:var(--gray-50);border-color:var(--gray-300);box-shadow:var(--sh-1)}
.btn-secondary{background:var(--color-primary-soft);color:var(--color-primary)}.btn-secondary:hover{background:var(--navy-100);color:var(--color-primary);box-shadow:var(--sh-1)}
.btn-sm{min-height:30px;padding:0 var(--sp-3);font-size:13px}
.btn-lg{min-height:44px;padding:0 var(--sp-5);font-size:var(--fs-md)}
@media (pointer:coarse){.btn{min-height:44px}.btn-sm{min-height:40px}.btn-lg{min-height:48px}.field input,.field select,.field textarea,.inline-form input,.inline-form select{min-height:44px}}
.btn:disabled,.btn[aria-disabled="true"]{transform:none;box-shadow:none}

/* Thẻ = lớp 2: viền mảnh, không bóng; rê → viền đậm + bóng nổi. Thẻ là liên kết thì nhấc lên thêm. */
.card{border-radius:var(--r-lg);box-shadow:none;border-color:var(--color-border)}
.card:hover{border-color:var(--gray-300);box-shadow:var(--sh-hover)}
.card-header{border-bottom-color:var(--color-border);font-weight:700;letter-spacing:-.01em;padding:var(--sp-4) var(--sp-5)}
.card-body{padding:var(--sp-5)}
.card-footer{padding:var(--sp-3) var(--sp-5)}
.stat{border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5)}
.stat:hover{border-color:var(--gray-300);box-shadow:var(--sh-hover)}
.stat-value{font-weight:600;color:var(--color-text)}
.stat-value.accent{color:var(--orange-700)}.stat-value.danger{color:var(--red-700)}
a.stat:hover,a.stat:focus-visible,a.card:hover,.dir-card:hover,.flow-step:hover,.ts-mini:hover{border-color:var(--navy-300);box-shadow:var(--sh-hover);transform:translateY(-2px)}
a.stat:active,a.card:active{transform:translateY(0) scale(.99)}
.dir-card,.flow-step,.ts-mini,.issue-panel{border-radius:var(--r-lg)}

/* Trạng thái = chấm + chữ (bỏ nền pastel) */
.badge{background:transparent!important;padding:0;gap:6px;font-weight:600;font-size:13px;color:var(--gray-700)}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gray-300);flex:none}
.badge-info{color:var(--navy-700)}.badge-info::before{background:var(--navy-500)}
.badge-success{color:var(--color-success)}.badge-success::before{background:var(--color-success)}
.badge-danger{color:var(--red-700)}.badge-danger::before{background:var(--red-500)}
.badge-warning{color:var(--orange-700)}.badge-warning::before{background:var(--orange-500)}
.badge-neutral{color:var(--gray-500)}.badge-neutral::before{background:var(--gray-300)}

/* Cảnh báo: nền nhạt trung tính + vạch màu bên trái */
.alert{border-radius:var(--r-md);background:var(--gray-50);border:1px solid var(--color-border);border-left-width:3px;color:var(--color-text)}
.alert-error,.alert-danger{border-left-color:var(--red-500);background:var(--red-50);color:var(--red-900)}
.alert-success{border-left-color:var(--color-success);background:var(--color-success-soft);color:#0B4D28}
.alert-warning{border-left-color:var(--orange-500);background:var(--orange-50);color:var(--orange-900)}
.alert-info{border-left-color:var(--navy-700);background:var(--navy-50);color:var(--navy-900)}

/* Bảng: đầu cột nhỏ in hoa; dòng = lớp 1 (rê → nền + vạch navy bên trái) */
.table-wrap{border-radius:var(--r-lg)}
.table th{background:var(--color-surface);color:var(--gray-500);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.table th,.table td{padding:10px var(--sp-3)}
.table tbody tr:hover,.table-hover tbody tr:hover{background:var(--gray-50)}
.table tbody tr:hover>:first-child{box-shadow:inset 3px 0 0 var(--color-primary)}
.row-selected td{background:var(--navy-50)}

/* Ô nhập: bo tròn, rê → viền đậm, focus → viền navy + vòng sáng */
.row>input,.row>select,.date-slot>input,.date-slot>select,.field input,.field select,.field textarea,.inline-form input,.inline-form select,.inline-form textarea,.comment-box textarea,.popover-panel input[type=text],.popover-panel select{border-radius:var(--r-md);border-color:var(--color-border)}
:is(.row>input,.row>select,.date-slot>input,.date-slot>select,.field input,.field select,.field textarea):hover{border-color:var(--gray-300)}
:is(.row>input,.row>select,.date-slot>input,.date-slot>select,.field input,.field select,.field textarea):focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(17,54,127,.14)}
.field label{color:var(--gray-700)}

/* Tab, chip, danh sách */
.tabs .tab{border-radius:var(--r-sm) var(--r-sm) 0 0;font-weight:500}
.tabs .tab:hover{background:var(--gray-50);color:var(--color-text)}
.tabs .tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:700}
.chip{transition:all var(--t) var(--ease)}
.chip:hover{border-color:var(--navy-300);background:var(--navy-50);color:var(--color-primary)}
.list li:hover{background:var(--gray-50)}
.list li:has(a):hover{box-shadow:inset 3px 0 0 var(--color-accent)}

/* Lớp nổi (popover, chuông, ngăn kéo) */
.bell-panel,.popover-panel{border-radius:var(--r-lg);box-shadow:var(--sh-pop);border-color:var(--color-border)}
.side-drawer{box-shadow:var(--sh-pop)}

/* Người: ảnh tròn; chưa có ảnh → chữ cái trên nền tông trầm theo tên (Person gán av-tone-N) */
.avatar-sm,.avatar-empty.avatar-sm{border-radius:50%}
.avatar-empty{color:#fff;background:var(--navy-700);font-weight:600}
.av-tone-0{background:var(--navy-700)}.av-tone-1{background:var(--navy-500)}.av-tone-2{background:var(--orange-900)}.av-tone-3{background:var(--red-700)}.av-tone-4{background:var(--gray-700)}.av-tone-5{background:#0E5A4E}
.person a{color:var(--color-text);text-decoration:none;font-weight:600}.person a:hover{color:var(--color-primary);text-decoration:underline}
.person-photo img{transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease)}.person-photo:hover img{transform:scale(1.08);box-shadow:0 0 0 2px var(--color-accent)}

/* Thanh dưới (điện thoại) */
.bottom-nav{background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.bottom-nav a{border-top:0;font-weight:500}
.bottom-nav a.active{color:var(--color-primary);font-weight:700}
.bottom-nav a.active svg{transform:translateY(-1px)}
.bottom-nav a:active{transform:scale(.94)}

/* Chấm công, ô ngày */
.punch-clock{color:var(--color-text);font-weight:600;font-size:48px}
.punch-btn{border-radius:var(--r-full);box-shadow:var(--glow-accent)}
.ts-day,.tg{border-radius:var(--r-sm)}
a.ts-day:hover,a.tg:hover{transform:translateY(-1px) scale(1.04);box-shadow:var(--sh-hover);position:relative;z-index:1}
.page-head h1{font-size:var(--fs-2xl);line-height:1.15}
.app-foot{border-top-color:var(--color-border)}

/* ADR-100 §3.1: ô tìm / lệnh (⌘K) — viên thuốc xám; rê → viền; focus → nền trắng + vòng navy; bảng kết quả = lớp nổi */
.cmdk{position:relative;display:flex;align-items:center;gap:8px;flex:0 1 440px;min-width:0;margin-left:var(--sp-4);height:40px;padding:0 6px 0 14px;border-radius:var(--r-full);background:var(--gray-100);border:1px solid transparent;color:var(--gray-500);transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.cmdk:hover{border-color:var(--gray-300);background:var(--gray-50)}
.cmdk:focus-within{background:#fff;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(17,54,127,.12)}
.cmdk svg{flex:none;width:18px;height:18px}
.cmdk input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:var(--fs-sm);color:var(--color-text);outline:0;height:100%}
.cmdk input::-webkit-search-cancel-button{display:none}
.cmdk-key{font-family:var(--font-mono);font-size:11px;color:var(--gray-500);border:1px solid var(--color-border);background:#fff;border-radius:6px;padding:2px 6px}
.cmdk-panel{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;min-width:320px;max-height:min(70vh,520px);overflow:auto;background:#fff;border:1px solid var(--color-border);border-radius:var(--r-lg);box-shadow:var(--sh-pop);padding:6px;z-index:60}
.cmdk:focus-within .cmdk-panel:not(:empty){display:block}
.cmd-results section+section{border-top:1px solid var(--color-border);margin-top:4px;padding-top:4px}
.cmd-results h4{margin:6px 10px 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-500)}
.cmd-results ul{list-style:none;margin:0;padding:0}
.cmd-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r-md);color:var(--color-text);text-decoration:none;transition:background-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.cmd-row:hover,.cmd-row.on{background:var(--navy-50);box-shadow:inset 3px 0 0 var(--color-accent);color:var(--color-primary)}
.cmd-ic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--gray-100);color:var(--gray-700);flex:none}
.cmd-ic svg{width:16px;height:16px}
.cmd-row:hover .cmd-ic,.cmd-row.on .cmd-ic{background:var(--color-primary);color:#fff}
.cmd-label{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmd-row .person{min-width:0;flex:1}
.cmd-hint{color:var(--gray-500);font-size:13px}.cmd-hint.mono{font-family:var(--font-mono)}
.cmd-kind{margin-left:auto;font-size:11px;color:var(--gray-500);border:1px solid var(--color-border);border-radius:var(--r-full);padding:1px 8px}
.cmd-empty{padding:12px;color:var(--gray-500);margin:0}
.cmd-page-form{display:flex;gap:var(--sp-2);max-width:640px;margin-bottom:var(--sp-4)}
.cmd-page-form input{flex:1;height:44px;border:1px solid var(--color-border);border-radius:var(--r-full);padding:0 var(--sp-4);font:inherit}
.cmd-page-form input:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(17,54,127,.14)}
.cmd-page-form+.cmd-results{max-width:640px;background:#fff;border:1px solid var(--color-border);border-radius:var(--r-lg);padding:6px}
/* nút + Tạo (cam, chữ tối) và danh sách tạo nhanh */
.create-menu>summary{list-style:none;gap:4px;font-weight:700}
.create-menu>summary::-webkit-details-marker{display:none}
.create-list{list-style:none;margin:0;padding:0;min-width:220px}
.create-list a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--r-md);color:var(--color-text);text-decoration:none;font-weight:500;transition:background-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.create-list a:hover{background:var(--orange-50);box-shadow:inset 3px 0 0 var(--color-accent)}
.create-list svg{width:18px;height:18px;color:var(--orange-700)}
.topbar .cmdk-mobile{display:none}
/* ADR-100 §3.3: danh sách + chi tiết — dòng = lớp 1 (rê → nền + vạch cam), dòng đang mở = nền navy nhạt + vạch navy; cột phải dính */
.inbox-list a{padding:10px 12px;border-radius:var(--r-md);position:relative;transition:background-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.inbox-list a:hover{background:var(--gray-50);box-shadow:inset 3px 0 0 var(--color-accent)}
.inbox-list a:active{transform:scale(.99)}
.inbox-list li.active a,.inbox-list a[aria-current]{background:var(--navy-50);box-shadow:inset 3px 0 0 var(--color-primary)}
.inbox-list li.active .t{color:var(--color-primary)}
.inbox-list .unread .t::before{background:var(--color-hot)}
.split-back{display:none}
.pane-empty{display:grid;place-items:center;align-content:center;gap:4px;min-height:320px;text-align:center;color:var(--gray-500);border:1px dashed var(--gray-300);border-radius:var(--r-lg);padding:var(--sp-6)}
.pane-empty p{margin:0}
.pane-bar{display:flex;align-items:center;gap:var(--sp-2);justify-content:space-between;margin-bottom:var(--sp-3);font-size:var(--fs-sm)}
.pane-body .page-head h1{font-size:var(--fs-xl)}
.pane-body .breadcrumb{display:none}
#pane.htmx-request{opacity:.55;transition:opacity var(--t) var(--ease)}
@media (min-width:1024px){
.split{display:grid;grid-template-columns:minmax(340px,440px) minmax(0,1fr);gap:var(--sp-5);align-items:start}
.split-auto:not(.split-open){display:block}
.split-auto:not(.split-open) .split-pane{display:none}
.split-auto.split-open{grid-template-columns:minmax(360px,480px) minmax(0,1fr)}
.split-pane{position:sticky;top:calc(var(--nav-h) + var(--sp-4));max-height:calc(100vh - var(--nav-h) - var(--sp-6));overflow:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-lg);padding:var(--sp-5);overscroll-behavior:contain}
.split-pane .pane-empty{border:0;min-height:50vh}
}
@media (max-width:1023px){
.split-pane{display:none}
.split-open .split-list{display:none}
.split-open .split-pane{display:block}
.split-open .split-back{display:inline-flex;margin-bottom:var(--sp-3)}
}
/* ADR-100 §3.4: sửa tại chỗ (loại A) — trường = lớp 1: rê → nền + viền mảnh + bút chì; đang sửa = khung trắng viền navy */
.ifields{display:grid;grid-template-columns:minmax(140px,200px) 1fr;column-gap:var(--sp-4)}
.ifield{display:contents}
.ifield-label{padding:10px 0;color:var(--gray-500);font-size:var(--fs-sm);align-self:start}
.ifield-value{position:relative;display:flex;align-items:flex-start;gap:8px;min-height:40px;padding:9px 36px 9px 10px;margin:1px 0;border-radius:var(--r-md);border:1px solid transparent;color:var(--color-text);text-decoration:none;transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
a.ifield-value:hover,a.ifield-value:focus-visible{background:var(--gray-50);border-color:var(--color-border);box-shadow:inset 3px 0 0 var(--color-accent)}
a.ifield-value:active{transform:scale(.99)}
.ifield-pen{position:absolute;right:10px;top:11px;width:16px;height:16px;fill:none;stroke:var(--gray-500);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity var(--t) var(--ease)}
a.ifield-value:hover .ifield-pen,a.ifield-value:focus-visible .ifield-pen{opacity:1;stroke:var(--color-primary)}
.ifield-empty{color:var(--gray-500);font-style:italic}
/* ô sửa được trong bảng (admin control plane, kiểu Jira): nhìn như chữ, rê → nền + bút; dòng đang sửa nổi nhẹ */
.table .ifield-cell{display:inline-flex;align-items:center;min-height:32px;padding:4px 28px 4px 8px;margin:-4px 0 -4px -8px;border-radius:var(--r-sm)}
.table .ifield-cell .ifield-pen{top:8px;right:8px}
.table tr.row-editing>td{background:var(--navy-50);box-shadow:inset 3px 0 0 var(--color-primary)}
.table tr.row-editing input:not([type=checkbox]),.table tr.row-editing select{min-height:34px;border:1px solid var(--color-primary);border-radius:var(--r-sm);padding:4px 8px;font:inherit;box-shadow:0 0 0 3px rgba(17,54,127,.12)}
.table td.row-actions{width:84px;white-space:nowrap}
.table td.row-actions .ifield-actions{margin:0}
.ifield-ro{color:var(--color-text);flex-direction:column;gap:2px}
.ifield-why{font-size:12px;color:var(--gray-500)}
.ifield-ok{grid-column:2;margin:-2px 0 4px 10px;font-size:12px;font-weight:600;color:var(--color-success)}
.ifield-saved .ifield-value{animation:ifield-flash 1.2s var(--ease)}
@keyframes ifield-flash{from{background:var(--color-success-soft)}to{background:transparent}}
form.ifield-editing{display:contents}
.ifield-box{padding:6px;margin:1px 0;border-radius:var(--r-md);background:#fff;border:1px solid var(--color-primary);box-shadow:0 0 0 4px rgba(17,54,127,.12),var(--sh-pop)}
.ifield-box input:not([type=hidden]),.ifield-box select,.ifield-box textarea{width:100%;min-height:40px;border:1px solid var(--color-border);border-radius:var(--r-sm);padding:6px 10px;font:inherit}
.ifield-box input:focus,.ifield-box select:focus,.ifield-box textarea:focus{outline:0;border-color:var(--color-primary)}
.ifield-actions{display:flex;align-items:center;gap:6px;margin-top:6px}
.ifield-hint{margin-left:auto;font-size:12px;color:var(--gray-500)}
/* nút biểu tượng nhỏ của ô sửa tại chỗ (góp ý 2026-11-10): 32px, ✓ navy đặc, ✕ viền; rê → sáng + nhấc; bấm → nén */
.ifield-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface);color:var(--gray-700);cursor:pointer;padding:0;transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.ifield-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ifield-btn:hover{transform:translateY(-1px);box-shadow:var(--sh-2)}
.ifield-btn:active{transform:scale(.92);box-shadow:none}
.ifield-save{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.ifield-save:hover{background:var(--color-primary-hover);box-shadow:var(--glow-primary)}
.ifield-cancel:hover{background:var(--gray-100);color:var(--color-text)}
.ifield-btn:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
.ifield-err{margin:6px 0 0;color:var(--red-700);font-size:var(--fs-sm)}
@media (max-width:767px){.ifields{grid-template-columns:1fr}.ifield-label{padding:8px 0 0}.ifield-ok{grid-column:1}.ifield-hint{display:none}}
@media (prefers-reduced-motion:reduce){.ifield-saved .ifield-value{animation:none}}
/* ADR-100 §3.4: trường loại B — giá trị + "hiệu lực từ"; khung nổi = lớp 4 (bóng lớn + màn mờ), bút = biểu tượng lịch */
.efields{display:grid;grid-template-columns:minmax(140px,200px) 1fr;column-gap:var(--sp-4);margin-bottom:var(--sp-3)}
.efield{display:contents}
.efield-label{padding:10px 0;color:var(--gray-500);font-size:var(--fs-sm);align-self:start}
.efield-value{position:relative;display:flex;flex-direction:column;gap:2px;min-height:40px;padding:8px 36px 8px 10px;margin:1px 0;border-radius:var(--r-md);border:1px solid transparent;color:var(--color-text);text-decoration:none;transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
a.efield-value:hover,a.efield-value:focus-visible{background:var(--gray-50);border-color:var(--color-border);box-shadow:inset 3px 0 0 var(--color-primary)}
a.efield-value:hover .ifield-pen,a.efield-value:focus-visible .ifield-pen{opacity:1;stroke:var(--color-primary)}
.efield-text{font-weight:600}
.efield-since{font-size:12px;color:var(--gray-500);font-weight:400}
.efield-ro{color:var(--color-text)}
form.efield-editing{display:contents}
.efield-anchor{position:relative;margin:1px 0}
.efield-current{background:var(--navy-50);border-color:var(--navy-300)}
.efield-scrim{position:fixed;inset:0;z-index:69;background:rgba(11,20,48,.18);-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px);animation:ef-fade var(--t) var(--ease)}
@keyframes ef-fade{from{opacity:0}to{opacity:1}}
.efield-pop{position:absolute;z-index:70;top:calc(100% + 8px);left:0;width:min(520px,calc(100vw - 32px));background:#fff;border:1px solid var(--color-border);border-radius:var(--r-lg);box-shadow:var(--sh-pop);padding:var(--sp-4);animation:ef-rise var(--t) var(--ease)}
@keyframes ef-rise{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.efield-pop h4{margin:0 0 4px;font-size:var(--fs-md)}
.efield-hint{margin:0 0 var(--sp-3);color:var(--gray-500);font-size:var(--fs-sm)}
.efield-grid{display:grid;grid-template-columns:120px 1fr;gap:8px var(--sp-3);align-items:center}
.efield-grid label{font-size:var(--fs-sm);color:var(--gray-700)}
.efield-grid select,.efield-grid input,.efield-grid textarea{width:100%;min-height:40px;border:1px solid var(--color-border);border-radius:var(--r-sm);padding:6px 10px;font:inherit}
.efield-grid textarea{align-self:start}
.efield-grid select:focus,.efield-grid input:focus,.efield-grid textarea:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(17,54,127,.14)}
.ef-preview-box{margin-top:var(--sp-3);padding:var(--sp-3);border-radius:var(--r-md);background:var(--gray-50);border:1px solid var(--color-border);font-size:var(--fs-sm)}
.ef-preview-box strong{display:block;margin-bottom:4px;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500)}
.ef-preview{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.ef-preview li{position:relative;padding-left:16px}
.ef-preview li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:50%;background:var(--navy-500)}
.ef-pv-warn::before{background:var(--orange-500)!important}
.ef-pv-danger{color:var(--red-700)}.ef-pv-danger::before{background:var(--red-500)!important}
.efield-flat .efield-pop{position:static;width:auto;box-shadow:none;background:var(--color-surface);margin-top:8px;animation:none}
.efields-ok{grid-column:1/-1;margin:4px 0 0;font-size:var(--fs-sm);font-weight:600;color:var(--color-success)}
.efields-saved .efield-current,.efields-saved .efield-value{animation:ifield-flash 1.2s var(--ease)}
@media (max-width:767px){.efields{grid-template-columns:1fr}.efield-label{padding:8px 0 0}.efield-pop{position:fixed;left:16px;right:16px;top:auto;bottom:16px;width:auto;max-height:80vh;overflow:auto}.efield-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.efield-scrim,.efield-pop,.efields-saved .efield-value{animation:none}}
/* ADR-100 §3.2 / 100f: bảng tin — bài = lớp 2 (viền mảnh, rê → nổi); phản hồi = lớp 1 */
.feed{display:grid;gap:var(--sp-3)}
.feed-card .card-body{padding:var(--sp-4)}
.kudos-form{display:grid;gap:8px;padding:var(--sp-3);border:1px dashed var(--orange-300);border-radius:var(--r-lg);background:var(--orange-50)}
.kudos-row{display:flex;gap:8px;align-items:center}
.kudos-row textarea{flex:1;min-height:44px;border:1px solid var(--color-border);border-radius:var(--r-md);padding:8px 10px;font:inherit;resize:vertical}
.kudos-row textarea:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(17,54,127,.14)}
.kudos-label{font-weight:700;color:var(--orange-900)}
.kudos-row .combo-box{flex:1}
.kudos-values{display:flex;flex-wrap:wrap;gap:6px}
.kudos-chip{cursor:pointer;background:#fff}
.kudos-chip input{position:absolute;opacity:0;width:0;height:0}
.kudos-chip:has(input:checked){background:var(--color-primary);color:#fff;border-color:var(--color-primary);box-shadow:var(--glow-primary)}
.kudos-chip:has(input:focus-visible){outline:2px solid var(--color-focus);outline-offset:2px}
.feed-item{position:relative;padding:var(--sp-4);border:1px solid var(--color-border);border-radius:var(--r-lg);background:var(--color-surface);transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.feed-item:hover{border-color:var(--gray-300);box-shadow:var(--sh-hover)}
.feed-item:target{border-color:var(--color-accent);box-shadow:0 0 0 3px rgba(255,108,34,.25)}
.feed-hidden{opacity:.6;border-style:dashed}
.feed-hidden-note{margin:4px 0 0;font-size:var(--fs-sm);color:var(--red-700)}
.feed-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:var(--fs-sm)}
.feed-verb{color:var(--gray-500)}
.feed-emoji{font-size:20px;line-height:1}
.feed-time{margin-left:auto;font-size:12px}
.feed-value{background:var(--navy-50);color:var(--color-primary);border-color:var(--navy-300)}
.feed-msg{margin:10px 0 0;font-size:var(--fs-md);line-height:1.5;white-space:pre-wrap}
.feed-foot{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:10px}
.feed-react{display:inline}
.react-btn{min-width:36px;height:32px;border-radius:var(--r-full);border:1px solid transparent;background:transparent;font-size:16px;cursor:pointer;transition:background-color var(--t) var(--ease),border-color var(--t) var(--ease),transform var(--t) var(--ease)}
.react-btn:hover{background:var(--gray-100);border-color:var(--color-border);transform:translateY(-1px)}
.react-btn:active{transform:scale(.9)}
.react-btn.on{background:var(--orange-50);border-color:var(--orange-300)}
.feed-count{font-size:var(--fs-sm);color:var(--gray-500);margin-right:6px}
.feed-comments{flex-basis:100%}
.feed-comments>summary,.feed-hide>summary{list-style:none;display:inline-flex}
.feed-comments>summary::-webkit-details-marker,.feed-hide>summary::-webkit-details-marker{display:none}
.feed-comments[open]>summary{margin-bottom:8px}
.feed-cm{padding-left:4px}
.cm-list{display:grid;gap:8px}
.cm{padding:8px 10px;border-radius:var(--r-md);background:var(--gray-50)}
.cm-head{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm)}
.cm-del{margin-left:auto}
.cm-body{margin-top:4px;white-space:pre-wrap}
.cm-deleted .cm-body{color:var(--gray-500)}
.cm-form{display:flex;gap:8px}
.cm-form input{flex:1;min-height:38px;border:1px solid var(--color-border);border-radius:var(--r-full);padding:0 14px;font:inherit}
.cm-form input:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(17,54,127,.14)}
.feed-hide{margin-left:auto}
.feed-hide-form{display:flex;gap:6px;margin-top:6px}
.feed-hide-form input{flex:1;min-height:36px;border:1px solid var(--color-border);border-radius:var(--r-md);padding:0 10px;font:inherit}
.feed-more{margin:0;text-align:center}
.hero-kudos{color:var(--orange-900);background:var(--orange-50);border-color:var(--orange-300);text-decoration:none}
.hero-kudos:hover{background:var(--orange-100)}
.row-form{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap}
/* 100g: ô viết hai tab (radio CSS) + bài đăng tự do */
.composer{border:1px solid var(--color-border);border-radius:var(--r-lg);overflow:hidden;background:var(--color-surface)}
.composer-tabs{display:flex;margin:0;padding:0;min-width:0;border:0;border-bottom:1px solid var(--color-border);background:var(--gray-50)}
.composer-tab{flex:1;text-align:center;padding:10px;font-weight:600;color:var(--gray-500);cursor:pointer;border-bottom:2px solid transparent;transition:color var(--t) var(--ease),background-color var(--t) var(--ease),border-color var(--t) var(--ease)}
.composer-tab:hover{background:var(--gray-100);color:var(--color-text)}
.composer-tabs input:focus-visible+.composer-tab{outline:2px solid var(--color-focus);outline-offset:-2px}
#ct-kudos:checked~[for=ct-kudos],#ct-post:checked~[for=ct-post]{color:var(--color-primary);border-bottom-color:var(--color-primary);background:var(--color-surface)}
.composer-pane{display:none;padding:var(--sp-3)}
.composer:has(#ct-kudos:checked) .composer-kudos,.composer:has(#ct-post:checked) .composer-post{display:block}
.composer .kudos-form{border:0;background:transparent;padding:0}
.post-form{display:grid;gap:8px}
.post-form textarea{min-height:72px;border:1px solid var(--color-border);border-radius:var(--r-md);padding:10px 12px;font:inherit;resize:vertical}
.post-form textarea:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(17,54,127,.14)}
.post-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:var(--fs-sm)}
.feed-post{white-space:normal}
.feed-del{margin-left:auto}
.feed-del+.feed-hide{margin-left:0}
/* ADR-100 §3.5: đầu trang hồ sơ kiểu trang cá nhân */
.hero{margin:calc(-1 * var(--sp-2)) 0 var(--sp-5);border:1px solid var(--color-border);border-radius:var(--r-lg);overflow:hidden;background:var(--color-surface)}
.hero-cover{height:112px;background:linear-gradient(100deg,var(--navy-900) 0%,var(--navy-700) 55%,var(--navy-500) 100%);position:relative}
.hero-cover::after{content:"";position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,108,34,.55),rgba(255,108,34,0) 70%)}
.hero-body{display:flex;align-items:flex-end;gap:var(--sp-4);padding:0 var(--sp-5) var(--sp-4);margin-top:-48px;flex-wrap:wrap}
.hero-avatar .avatar{width:112px;height:112px;border-radius:50%;border:4px solid var(--color-surface);box-shadow:var(--sh-2);font-size:36px}
.hero-main{flex:1;min-width:220px;padding-top:52px}
.hero-main h1{margin:0;font-size:var(--fs-xl);line-height:1.2;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hero-you{font-size:12px;font-weight:600;color:var(--orange-700);background:var(--orange-50);border:1px solid var(--orange-300);border-radius:var(--r-full);padding:1px 8px}
.hero-sub{margin:2px 0 8px;color:var(--gray-500)}
.hero-chips{display:flex;gap:6px;flex-wrap:wrap}
.chip-static{cursor:default}
.hero-st::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:var(--gray-300);vertical-align:middle}
.hero-st-work{color:var(--color-success)}.hero-st-work::before{background:var(--color-success)}
.hero-st-leave{color:var(--orange-700)}.hero-st-leave::before{background:var(--orange-500)}
.hero-st-remote{color:var(--navy-700)}.hero-st-remote::before{background:var(--navy-500)}
.hero-st-trip{color:var(--navy-700)}.hero-st-trip::before{background:var(--navy-500)}
.hero-st-off{color:var(--gray-500)}
.hero-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;padding-top:52px}
@media (max-width:767px){.hero-cover{height:88px}.hero-body{margin-top:-40px}.hero-avatar .avatar{width:88px;height:88px;font-size:28px}.hero-main,.hero-actions{padding-top:0;flex-basis:100%}}
@media (max-width:767px){.cmdk{display:none}.topbar .cmdk-mobile{display:flex}.create-label{display:none}}