/* Shared geometry fixes. Keep semantic colors and existing access behavior. */
:root[data-design]{--u63-body:15px;--u63-label:13px;--u63-leading:1.5}
:root[data-design] body{font-size:var(--u63-body);line-height:var(--u63-leading)}
:root[data-design] :where(h1,h2,h3){line-height:1.25;overflow-wrap:break-word;text-wrap:balance}
:root[data-design] h1{font-size:clamp(25px,2.2vw,30px);letter-spacing:-.6px}
:root[data-design] h2{font-size:22px;letter-spacing:-.35px}
:root[data-design] h3{font-size:17px;letter-spacing:-.1px}
:root[data-design] :where(p,small,label){line-height:1.5}
:root[data-design] :where(.page-head,.page-head>.actions){min-width:0;flex-wrap:wrap;align-items:flex-start}
:root[data-design] .page-head>div:first-child{flex:1 1 250px;min-width:0}
:root[data-design] .page-head>.actions{flex:0 1 auto;justify-content:flex-start;gap:8px}
:root[data-design] .page-head :where(h1,p){max-width:100%}
:root[data-design] :where(button,.button){min-height:40px;max-width:100%;line-height:1.4;white-space:normal;word-break:normal;overflow-wrap:break-word}
:root[data-design] :where(.actions,.form-actions,.profile-actions){flex-wrap:wrap;gap:8px}
:root[data-design] :where(.actions,.form-actions)>button{flex-shrink:0;max-width:100%}
:root[data-design] :where(.link-button,.o62-item .link-button){font-size:14px;line-height:1.5;text-align:left;justify-content:flex-start;word-break:normal;overflow-wrap:break-word;white-space:normal}
:root[data-design] :where(.profile-fields,.profile-fields>div,.stack,.subordinates,.person-mini>div,.row.between>div,.w13-detail-grid>*){min-width:0}
:root[data-design] :where(.profile-fields strong,.person-mini b,.identity strong,.task-card p){overflow-wrap:break-word;word-break:normal;line-height:1.5}
:root[data-design] .badge{flex-shrink:0;max-width:100%;font-size:12px;line-height:1.4;white-space:normal;word-break:normal}
:root[data-design] .employee-profile{grid-template-columns:minmax(230px,260px) minmax(330px,1fr) minmax(270px,320px);align-items:start}
:root[data-design] .employee-profile>aside:last-child{grid-column:auto;grid-template-columns:minmax(0,1fr)}
:root[data-design] .subordinates>div{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px}
:root[data-design] .subordinates>div>span{flex-basis:100%;font-size:13px;color:var(--muted)}
:root[data-design] .person-mini{display:flex;max-width:100%;flex:0 1 270px;text-align:left;justify-content:flex-start;white-space:normal;min-height:54px}
:root[data-design] .person-mini>div:last-child{min-width:0;flex:1}
:root[data-design] .person-mini small{white-space:normal}
:root[data-design] .u63-task-row{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:start;column-gap:11px;row-gap:3px;padding:16px 0}
:root[data-design] .u63-task-row .avatar{grid-column:1;grid-row:1 / span 2}
:root[data-design] .u63-task-row>.grow{grid-column:2;min-width:0}
:root[data-design] .u63-task-row>.badge{grid-column:2;justify-self:start;margin-top:5px}
:root[data-design] .u63-task-row .link-button{min-height:0;display:block;width:100%;color:var(--ink);font-weight:550}
:root[data-design] .u63-task-row .link-button:hover{color:var(--accent)}
:root[data-design] .u63-task-row small{font-size:12px}
:root[data-design] .u63-account-actions{display:grid;gap:10px}
:root[data-design] .u63-account-actions button{justify-content:flex-start}
:root[data-design] .u63-account{border-style:dashed}
:root[data-design] .u63-process-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;margin:0 0 24px;background:var(--surface2);border:1px solid var(--line);border-radius:13px}
:root[data-design] .u63-process-tabs button{min-height:42px;padding:8px 12px;border:0;background:transparent;color:var(--muted);font-size:13px;flex:0 1 auto}
:root[data-design] .u63-process-tabs button[aria-current=page]{background:var(--surface);color:var(--accent);box-shadow:0 1px 4px #0001;font-weight:650}
:root[data-design] .o62-summary .row.between{align-items:flex-start;flex-wrap:wrap}
:root[data-design] .o62-item{align-items:flex-start;flex-wrap:wrap}
:root[data-design] .o62-item>div{flex:1 1 220px}
:root[data-design] .o62-item>.badge{flex:0 0 auto}
:root[data-design] .o62-toolbar label{min-width:min(220px,100%)}
:root[data-design] .sidebar .brand{margin-bottom:20px}
:root[data-design] .sidebar>.nav-label{margin-top:7px}
:root[data-design] .u63-main-nav{flex-shrink:0;gap:3px}
:root[data-design] .u63-main-nav button{min-height:44px;gap:10px;padding:10px 11px;align-items:center;font-size:13px;line-height:1.35}
:root[data-design] .u63-main-nav button>span{min-width:0;overflow-wrap:break-word}
:root[data-design] .u63-nav-tools{display:flex;gap:6px;margin:12px 0 0;flex-shrink:0}
:root[data-design] .u63-nav-tools>button:first-child{flex:1;justify-content:flex-start;font-size:12px;padding:9px;min-width:0}
:root[data-design] .u63-nav-tools>button:last-child{flex-shrink:0;min-width:42px;padding:8px}
:root[data-design] .u63-current-label{font-size:11px;color:var(--muted);padding:10px 11px 2px}
:root[data-design] .u63-side-context{border-top:1px solid var(--line);margin-top:18px;padding-top:15px;min-height:0;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;flex-shrink:1}
:root[data-design] .u63-side-context[hidden]{display:none!important}
:root[data-design] .u63-side-context h3{font-size:13px;margin:0 4px 10px;line-height:1.4}
:root[data-design] .u63-side-context p{font-size:12px;margin:8px 4px}
:root[data-design] .u63-side-context button{display:block;width:100%;text-align:left;padding:10px 7px;margin:3px 0;font-size:12px;min-height:44px;background:transparent;border-color:transparent}
:root[data-design] .u63-side-context button:hover{background:var(--soft)}
:root[data-design] .u63-side-context button span{display:block;overflow-wrap:break-word}
:root[data-design] .u63-side-context button small{font-size:11px;display:block;margin-top:5px}
:root[data-design] .u63-menu-choice{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
:root[data-design] .u63-menu-choice label{display:flex;align-items:center;gap:12px;flex:1;min-width:0;color:var(--ink);font-size:14px;min-height:44px}
:root[data-design] .u63-menu-choice input{width:20px;height:20px;min-width:20px;margin:0;accent-color:var(--accent)}
:root[data-design] .u63-move{display:flex;gap:8px}
:root[data-design] .u63-move button{width:44px;min-height:44px;padding:6px;font-size:19px}
:root[data-design] .u63-all-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
:root[data-design] .u63-all-sections button{justify-content:flex-start;text-align:left;min-height:48px;padding:12px}
:root[data-design] .dialog-head{gap:16px;align-items:flex-start}
:root[data-design] .dialog-head h2{flex:1;min-width:0;font-size:21px;line-height:1.35}
:root[data-design] .dialog-head>button{flex:0 0 44px;min-height:44px}
:root[data-design] .dialog-body .form-actions{justify-content:flex-end}
:root[data-design] :where(.table td.text-wrap,.table td .link-button){white-space:normal;overflow-wrap:break-word}
/* Four optional app-wide appearances. Existing selections stay valid. */
:root[data-design=clarity]{--accent:#a62663;--soft:#f8eaf1;--bg:#f5f5f8;--surface:#fff;--surface2:#faf9fb;--ink:#24202b;--muted:#6c6675;--line:#e4dfe8;--d11-nav:#fff;--d11-radius:14px;--d11-control-radius:10px;--sidebar:246px}
:root[data-design=control]{--accent:#185daf;--soft:#e5effa;--bg:#eff3f6;--surface:#fff;--surface2:#f5f7fa;--ink:#142639;--muted:#536575;--line:#dce4ec;--d11-radius:7px;--d11-control-radius:5px;--sidebar:246px}
:root[data-design=flow]{--accent:#526536;--soft:#e7ecd9;--bg:#f5f2eb;--surface:#fffefa;--surface2:#eeebe3;--ink:#302c24;--muted:#706659;--line:#e3ddd0;--d11-nav:#fffefa;--d11-radius:18px;--d11-control-radius:13px;--sidebar:246px}
:root[data-design=calm]{--accent:#176882;--soft:#e3f1f6;--bg:#f1f5f7;--surface:#fff;--surface2:#f5f8f9;--ink:#193444;--muted:#526d7c;--line:#dfe9ef;--d11-nav:#fff;--d11-radius:20px;--d11-control-radius:15px;--sidebar:246px}
:root[data-design=control] .sidebar{--ink:#eff5fb;--muted:#c1d0df;--surface:#142a41;--surface2:#203a54;--line:#3c5369;--soft:#203a54;--accent:#afd5ff;background:var(--surface);color:var(--ink)}
:root[data-design=control] .sidebar .brand img{filter:brightness(0) invert(1)}
:root[data-design=control] .sidebar .nav button{color:var(--muted)}
:root[data-design=control] .sidebar .nav button.active{color:var(--ink);background:var(--soft);border-left:3px solid var(--accent)}
:root:is([data-design=clarity],[data-design=control],[data-design=flow],[data-design=calm]) :where(.card,.board-col,.task-card){border-radius:var(--d11-radius)}
:root:is([data-design=clarity],[data-design=control],[data-design=flow],[data-design=calm]) :where(button,input,select,textarea){border-radius:var(--d11-control-radius)}
:root[data-design=calm] :where(.page-head .primary,.form-actions .primary){padding:11px 20px;min-height:44px;border-radius:24px}
:root[data-design=flow] .board-col{background:var(--surface2)}
:root[data-design=clarity][data-theme=dark]{--accent:#f1a4c8;--soft:#3e2639;--bg:#17141c;--surface:#24202a;--surface2:#211d25;--ink:#f4eff8;--muted:#b9b1c5;--line:#403849;--d11-nav:#24202a}
:root[data-design=control][data-theme=dark]{--accent:#93c8ff;--soft:#233e5b;--bg:#101923;--surface:#1a2531;--surface2:#202d3b;--ink:#eff5fb;--muted:#aebecb;--line:#364758;--d11-nav:#1a2531}
:root[data-design=flow][data-theme=dark]{--accent:#c3d698;--soft:#3c462c;--bg:#211e19;--surface:#302b24;--surface2:#28231e;--ink:#f5f0e4;--muted:#c7baa4;--line:#4b4236;--d11-nav:#302b24}
:root[data-design=calm][data-theme=dark]{--accent:#9bd8ee;--soft:#2b4653;--bg:#151e24;--surface:#202d36;--surface2:#1b2730;--ink:#e9f5fc;--muted:#a9c1cf;--line:#344e5d;--d11-nav:#202d36}
:root:is([data-design=clarity],[data-design=control],[data-design=flow],[data-design=calm])[data-theme=dark] .primary{color:var(--bg)}
.d11-preview-clarity{color:#a62663;background:#f5f5f8}.d11-preview-control{color:#185daf;background:#eff3f6}.d11-preview-control .d11-preview-sidebar{background:#142a41}.d11-preview-flow{color:#526536;background:#f5f2eb}.d11-preview-calm{color:#176882;background:#f1f5f7}
@media(max-width:1400px){:root[data-design] .employee-profile{grid-template-columns:minmax(230px,270px) minmax(0,1fr)}:root[data-design] .employee-profile>aside:last-child{grid-column:2;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
@media(max-width:1000px){:root[data-design] .employee-profile{grid-template-columns:minmax(210px,240px) minmax(0,1fr)}:root[data-design] .employee-profile>aside:last-child{grid-column:1/-1}}
@media(max-width:900px){:root[data-design] .u63-side-context{display:none!important}:root[data-design] :where(button,input,select,textarea){font-size:16px;min-height:44px}:root[data-design] .page-head>.actions{flex-basis:100%;width:100%;justify-content:flex-start}:root[data-design] .page-head>.actions>button{flex:0 1 auto;min-height:44px}:root[data-design] :where(.page-head p,.profile-fields strong){font-size:14px}:root[data-design] .u63-process-tabs{gap:6px;padding:6px}:root[data-design] .u63-process-tabs button{flex:1 1 135px;min-height:44px;font-size:13px}:root[data-design] .form-actions>button{flex:1 1 130px}:root[data-design] .u63-task-row .link-button{font-size:15px;min-height:44px}:root[data-design] .u63-task-row>.badge{font-size:12px}:root[data-design] .topbar .path{min-width:0;overflow-wrap:break-word}:root[data-design] .topbar>.row{min-width:0;flex:1}:root[data-design] .top-actions{flex-shrink:0}:root[data-design] .o62-summary .row.between>div{flex-basis:100%}:root[data-design] .o62-toolbar label{min-width:0;flex:1 1 100%}}
@media(max-width:760px){:root[data-design] .employee-profile{grid-template-columns:minmax(0,1fr)}:root[data-design] .employee-profile>aside:last-child{grid-column:auto;grid-template-columns:minmax(0,1fr)}:root[data-design] .profile-fields{grid-template-columns:minmax(0,1fr)}:root[data-design] .u63-all-sections{grid-template-columns:minmax(0,1fr)}:root[data-design] .u63-menu-choice label{font-size:14px}:root[data-design] .page .row.between{flex-wrap:wrap}:root[data-design] .page-head{gap:13px}:root[data-design] .page-head h1{font-size:26px}:root[data-design] .person-mini{flex-basis:100%}:root[data-design] .board{grid-template-columns:repeat(4,minmax(240px,1fr));scroll-snap-type:x proximity}:root[data-design] .board-col{scroll-snap-align:start}:root[data-design] .task-card p{font-size:15px}:root[data-design] .dialog{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.u63-main-nav *,.u63-process-tabs *{transition:none!important}}
@media(forced-colors:active){.u63-process-tabs button[aria-current=page]{outline:2px solid Highlight}.u63-side-context,.u63-menu-choice{border-color:CanvasText}}

:root:is([data-design=clarity],[data-design=control],[data-design=flow],[data-design=calm]){--d11-action:var(--accent);--d11-action-hover:color-mix(in srgb,var(--accent) 85%,var(--ink));--d11-focus:var(--accent)}
:root:is([data-design=clarity],[data-design=control],[data-design=flow],[data-design=calm])[data-theme=dark] .primary:hover{color:var(--bg)}

/* Keep task summaries next to the profile, even when account settings are long. */
:root[data-design] .profile-actions{display:flex;flex-wrap:wrap;gap:8px}
:root[data-design] .profile-actions>button{flex:1 1 108px;min-width:0;min-height:44px}
@media(min-width:761px) and (max-width:1400px){
 :root[data-design] .employee-profile{grid-template-columns:minmax(210px,270px) minmax(0,1fr);grid-template-rows:auto 1fr}
 :root[data-design] .employee-profile>aside:first-child{grid-column:1;grid-row:1 / span 2}
 :root[data-design] .employee-profile>main{grid-column:2;grid-row:1}
 :root[data-design] .employee-profile>aside:last-child{grid-column:2;grid-row:2;align-self:start;grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
 :root[data-design] .employee-profile>aside:first-child{display:contents}
 :root[data-design] .employee-profile>aside:first-child>.identity-card{order:-3}
 :root[data-design] .employee-profile>main{order:-2}
 :root[data-design] .employee-profile>aside:last-child{order:-1}
}

/* Five document filters need complete labels at phone widths. */
@media(max-width:950px){
 :root[data-design] .w35-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-bottom:12px}
 :root[data-design] .w35-tabs button{display:flex;align-items:center;justify-content:center;min-height:46px;gap:6px;padding:9px 7px;font-size:14px;line-height:1.4;min-width:0}
 :root[data-design] .w35-tabs button:last-child{grid-column:1/-1}
 :root[data-design] .w35-tabs b{flex-shrink:0;font-size:12px}
 :root[data-design] .w35-buckets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
 :root[data-design] .w35-buckets button{min-width:0;min-height:44px;padding:8px 6px;font-size:14px}
 :root[data-design] .w35-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 :root[data-design] .w35-filters .w35-search,:root[data-design] .w35-filters>select{grid-column:1/-1;width:100%;max-width:none;min-width:0}
 :root[data-design] .w35-filters>button{width:100%;min-height:44px}
 :root[data-design] .w35-heading-actions button{font-size:14px;min-height:46px}
}
