:root{
  --wd-blue:#0875e1;
  --wd-blue-dark:#005cb9;
  --wd-blue-deep:#004b9b;
  --wd-blue-soft:#eaf4ff;
  --wd-sky:#20a4f3;
  --wd-orange:#f59d17;
  --wd-green:#2eaa73;
  --wd-red:#d64242;
  --wd-purple:#6f63c5;
  --ink:#273746;
  --ink-strong:#172b3a;
  --muted:#6c7d8c;
  --line:#d9e1e7;
  --line-soft:#e9eef2;
  --surface:#ffffff;
  --surface-2:#f4f6f8;
  --surface-3:#eef2f5;
  --shadow:0 2px 8px rgba(30,54,73,.12);
  --shadow-lg:0 12px 32px rgba(30,54,73,.16);
  --header:60px;
  --rail:64px;
  --radius:5px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--surface-2);color:var(--ink);font-family:"Segoe UI",Inter,Arial,sans-serif;font-size:14px;line-height:1.45}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.mobile-only{display:none}
.full{width:100%}
body.dark{--ink:#eaf1f6;--ink-strong:#fff;--muted:#aab8c4;--line:#304354;--line-soft:#293c4d;--surface:#172b3a;--surface-2:#102332;--surface-3:#203746;--shadow:0 2px 9px rgba(0,0,0,.35);--shadow-lg:0 15px 38px rgba(0,0,0,.48)}

/* loading */
.loading-screen{position:fixed;inset:0;z-index:9999;background:linear-gradient(155deg,#fff 0 58%,#eaf4ff 58% 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--ink-strong)}
.loading-orbit{width:92px;height:92px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 8px 32px rgba(0,92,185,.18);border:1px solid #dce9f5;position:relative}
.loading-orbit:after{content:"";position:absolute;inset:-8px;border:3px solid transparent;border-top-color:var(--wd-blue);border-right-color:var(--wd-orange);border-radius:50%;animation:spin 1s linear infinite}
.loading-orbit img{width:68px;height:68px;object-fit:contain}
.loading-screen strong{font-size:24px;color:var(--wd-blue-dark)}
.loading-screen span{color:var(--muted)}
.loading-screen>i{width:180px;height:4px;border-radius:8px;background:#d8e3ec;overflow:hidden;position:relative;margin-top:6px}
.loading-screen>i:after{content:"";position:absolute;inset:0 auto 0 0;width:44%;background:var(--wd-blue);animation:load 1.15s ease-in-out infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes load{0%{transform:translateX(-120%)}100%{transform:translateX(350%)}}

/* sign in */
.auth-layout{min-height:100vh;background:linear-gradient(180deg,#fff 0 72px,#f3f6f8 72px);display:grid;grid-template-columns:minmax(0,1fr) 520px;position:relative}
.auth-layout:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--wd-blue) 0 78%,var(--wd-orange) 78% 100%)}
.auth-visual{position:relative;overflow:hidden;padding:118px 7vw 64px;color:#fff;background:linear-gradient(145deg,#026bcf,#0d83eb 62%,#20a4f3)}
.auth-visual:after{content:"";position:absolute;width:720px;height:720px;border:110px solid rgba(255,255,255,.08);border-radius:50%;right:-330px;bottom:-370px}
.auth-brandmark{position:absolute;top:24px;left:30px;display:flex;align-items:center;gap:12px;color:var(--ink-strong);font-size:12px;font-weight:700;letter-spacing:.08em}
.auth-brandmark img{width:45px;height:45px;object-fit:contain;background:#fff;border-radius:5px;padding:3px}
.auth-copy{position:relative;z-index:2;max-width:820px;margin-top:8vh}
.auth-copy small{font-weight:700;letter-spacing:.16em;color:#d9efff}
.auth-copy h1{font-size:clamp(42px,5vw,72px);line-height:1.04;margin:18px 0 22px;font-weight:500;letter-spacing:-.035em}
.auth-copy p{max-width:690px;font-size:18px;line-height:1.65;color:#eff8ff;margin:0}
.auth-metrics{display:flex;gap:14px;margin-top:40px;flex-wrap:wrap}
.auth-metrics article{min-width:145px;padding:17px 20px;border:1px solid rgba(255,255,255,.38);background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border-radius:4px}
.auth-metrics b{display:block;font-size:28px;font-weight:600}.auth-metrics span{font-size:12px;color:#ecf7ff}
.auth-orbs{display:none}
.auth-panel{display:grid;place-items:center;padding:40px;background:#f4f6f8}
.auth-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:6px;padding:35px 40px;box-shadow:0 8px 28px rgba(31,56,76,.13)}
.auth-logo-row{display:flex;align-items:center;gap:12px}.auth-logo-row img{width:44px;height:44px;object-fit:contain}.auth-logo-row b,.auth-logo-row small{display:block}.auth-logo-row b{font-size:18px;color:var(--wd-blue-dark)}.auth-logo-row small{color:var(--muted)}
.auth-card h2{font-size:30px;font-weight:500;margin:30px 0 6px;color:var(--ink-strong)}.auth-subtitle{color:var(--muted);margin:0 0 23px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line);margin-bottom:22px}.auth-tabs button{border:0;border-bottom:3px solid transparent;background:transparent;padding:10px 6px;color:var(--muted);font-weight:600}.auth-tabs button.active{color:var(--wd-blue);border-bottom-color:var(--wd-blue)}
.auth-card label{display:grid;gap:7px;margin:15px 0;color:var(--ink-strong);font-weight:600}
input,select,textarea{width:100%;border:1px solid #bfcbd4;background:var(--surface);color:var(--ink);border-radius:3px;padding:11px 12px;outline:none;transition:.18s}
input:focus,select:focus,textarea:focus{border-color:var(--wd-blue);box-shadow:0 0 0 2px rgba(8,117,225,.13)}textarea{min-height:110px;resize:vertical}
.auth-note{display:flex;gap:10px;padding:13px;border:1px solid #cce4f9;background:#f0f8ff;color:#315f83;margin-top:18px;border-radius:4px}.auth-note span{color:var(--wd-green)}.auth-note p{margin:0;font-size:12px}

/* buttons */
.primary-btn,.secondary-btn,.text-action{border-radius:3px;padding:9px 14px;font-weight:600;border:1px solid transparent;min-height:36px}
.primary-btn{background:var(--wd-blue);color:#fff;border-color:var(--wd-blue)}.primary-btn:hover{background:var(--wd-blue-dark);border-color:var(--wd-blue-dark)}.primary-btn:disabled{opacity:.55;cursor:not-allowed}
.secondary-btn{background:var(--surface);border-color:#aebcc6;color:var(--ink-strong)}.secondary-btn:hover{border-color:var(--wd-blue);color:var(--wd-blue)}
.text-action{background:transparent;color:var(--wd-blue);padding:5px 6px}.text-action:hover{text-decoration:underline}

/* top bar */
.site-header{position:fixed;inset:0 0 auto 0;height:var(--header);z-index:60;background:var(--surface);border-bottom:1px solid var(--line);box-shadow:0 1px 4px rgba(27,51,68,.1);transition:.22s}
.site-header.header-hidden{transform:translateY(-100%)}
.topbar{height:100%;display:flex;align-items:center;gap:10px;padding:0 16px 0 12px}
.brand-btn{border:0;background:transparent;width:48px;min-width:48px;height:48px;display:grid;place-items:center;color:var(--ink);padding:0}
.brand-btn img{width:38px;height:38px;object-fit:contain}.brand-btn span{display:none}
.launcher-btn{width:42px;height:42px;display:grid;place-items:center;border:0;border-left:1px solid var(--line);background:transparent;color:var(--wd-blue);padding:0;margin-left:1px}.launcher-btn span{font-size:23px;line-height:1}.launcher-btn b{display:none}
.global-search{width:min(520px,45vw);height:38px;display:flex;align-items:center;gap:8px;background:#f2f5f7;border:1px solid transparent;border-radius:3px;padding:0 11px;margin-left:4px}.global-search:focus-within{background:#fff;border-color:var(--wd-blue)}.global-search>span{font-size:19px;color:#596d7b}.global-search input{border:0;background:transparent;padding:0;box-shadow:none}.global-search kbd{font-size:10px;padding:3px 6px;border:1px solid #c8d2d9;border-radius:3px;color:var(--muted);background:#fff}
.top-actions{margin-left:auto;display:flex;align-items:center;gap:4px}.icon-btn{width:38px;height:38px;border:0;background:transparent;border-radius:50%;color:#536877;font-weight:700;position:relative}.icon-btn:hover{background:#eef4f9;color:var(--wd-blue)}.text-btn{font-size:11px}
.task-chip{height:38px;display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#536877;border-radius:20px;padding:0 10px;font-weight:600}.task-chip:hover{background:#eef4f9}.task-chip em{min-width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--wd-orange);color:#fff;font-size:11px;font-style:normal}.badge-host .badge{position:absolute;right:-1px;top:-2px;min-width:17px;height:17px;border-radius:10px;background:var(--wd-orange);color:#fff;font-size:10px;display:grid;place-items:center;padding:0 4px}
.user-chip{display:flex;align-items:center;gap:8px;border:0;background:transparent;border-left:1px solid var(--line);padding:4px 4px 4px 12px;color:var(--ink);min-width:150px;text-align:left}.user-chip>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f6d5bc;color:#7a3d13;font-weight:700}.user-chip b,.user-chip small{display:block}.user-chip b{max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}.user-chip small{color:var(--muted);font-size:10px}.user-chip small i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--wd-green);margin-right:4px}.user-chip em{font-style:normal;color:var(--muted)}
.offline-ribbon{position:absolute;top:60px;left:0;right:0;min-height:38px;background:#fff3d6;border-bottom:1px solid #efd18d;color:#714d00;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 18px;font-size:12px}.offline-ribbon span{font-weight:700}.offline-ribbon button{border:1px solid #d9ad4f;background:#fff8e7;color:#714d00;border-radius:3px;padding:5px 9px;font-weight:600}

/* Workday-style icon rail */
.sidebar{position:fixed;z-index:55;left:0;top:var(--header);bottom:0;width:var(--rail);background:var(--surface);border-right:1px solid var(--line);box-shadow:1px 0 4px rgba(30,54,73,.06);display:flex;flex-direction:column;transition:width .18s ease;overflow:hidden}
.sidebar:hover,.sidebar.open{width:248px;box-shadow:5px 0 18px rgba(30,54,73,.15)}
.sidebar-user{height:58px;min-height:58px;display:flex;align-items:center;gap:11px;padding:9px 13px;border-bottom:1px solid var(--line-soft);overflow:hidden}.sidebar-user>span{min-width:36px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#d7ebff;color:var(--wd-blue-dark);font-weight:700}.sidebar-user div{min-width:160px;opacity:0;transition:.12s}.sidebar:hover .sidebar-user div,.sidebar.open .sidebar-user div{opacity:1}.sidebar-user b,.sidebar-user small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user small{font-size:11px;color:var(--muted)}
#navigation{flex:1;overflow-y:auto;overflow-x:hidden;padding:8px 0 12px;scrollbar-width:thin}.nav-group-label{display:block;height:0;overflow:hidden;opacity:0;margin:0}.sidebar:hover .nav-group-label,.sidebar.open .nav-group-label{height:auto;opacity:1;margin:12px 16px 5px;font-size:9px;letter-spacing:.12em;font-weight:700;color:#8b9aa5}
.nav-item{position:relative;width:100%;height:46px;border:0;background:transparent;color:#526575;display:flex;align-items:center;gap:14px;padding:0 13px;text-align:left;white-space:nowrap}.nav-item span{width:36px;min-width:36px;height:36px;display:grid;place-items:center;font-size:19px;border-radius:3px}.nav-item b{font-weight:500;opacity:0;min-width:150px}.sidebar:hover .nav-item b,.sidebar.open .nav-item b{opacity:1}.nav-item:hover{background:#f1f6fb;color:var(--wd-blue)}.nav-item.active{color:var(--wd-blue-dark);background:#e8f3fd}.nav-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--wd-blue)}.nav-item.active span{color:var(--wd-blue)}
.sidebar-footer{padding:7px;border-top:1px solid var(--line-soft)}.connection-card{height:44px;display:flex;align-items:center;gap:10px;padding:0 7px;border-radius:3px;color:var(--muted);overflow:hidden}.connection-card>i{width:9px;height:9px;border-radius:50%;background:var(--wd-green);min-width:9px}.connection-card>span{min-width:142px;opacity:0}.sidebar:hover .connection-card>span,.sidebar.open .connection-card>span{opacity:1}.connection-card b,.connection-card small{display:block;white-space:nowrap}.connection-card b{font-size:11px;color:var(--ink)}.connection-card small{font-size:9px}.connection-card em{min-width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#e8f3fd;color:var(--wd-blue);font-size:10px;font-style:normal}
.sidebar-action{width:100%;height:38px;border:0;background:transparent;color:#5c6d7b;text-align:left;border-radius:3px;padding:0 10px;white-space:nowrap;overflow:hidden}.sidebar-action:hover{background:#f1f6fb;color:var(--wd-blue)}.sidebar-action.danger:hover{color:var(--wd-red);background:#fff1f1}

/* page */
.main-content{margin-left:var(--rail);padding-top:var(--header);min-height:100vh;transition:margin .18s}
.page-header{min-height:142px;background:linear-gradient(115deg,var(--wd-blue-dark),var(--wd-blue) 70%,#0b88ed);color:#fff;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:28px clamp(24px,4vw,58px) 25px;border-bottom:1px solid #0064c2}
.page-header>div:first-child{max-width:820px}.section-kicker{font-size:10px;letter-spacing:.13em;font-weight:700;color:#cce8ff}.page-header h1{font-size:29px;font-weight:400;margin:4px 0 5px;letter-spacing:-.02em}.page-header p{margin:0;color:#e2f1ff;max-width:760px}.page-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.page-header .primary-btn{background:#fff;color:var(--wd-blue-dark);border-color:#fff}.page-header .secondary-btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
#content{padding:20px clamp(18px,3vw,42px) 40px;max-width:1640px;margin:0 auto}.main-content>footer{padding:12px 30px 24px;color:#82909b;text-align:center;font-size:11px}

/* dashboard */
.hero-workspace{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:14px;margin-bottom:14px}.welcome-card,.day-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius)}.welcome-card{padding:25px 28px;position:relative;overflow:hidden}.welcome-card:after{content:"";position:absolute;width:170px;height:170px;border:35px solid #e8f3fd;border-radius:50%;right:-75px;bottom:-95px}.welcome-card small,.day-date{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--wd-blue)}.welcome-card h2{font-size:24px;font-weight:400;margin:7px 0 7px;color:var(--ink-strong)}.welcome-card p{color:var(--muted);max-width:760px;margin:0;position:relative;z-index:1}.welcome-actions{display:flex;gap:8px;margin-top:18px;position:relative;z-index:1;flex-wrap:wrap}.welcome-actions button{border:1px solid #aebcc6;background:#fff;color:var(--ink-strong);border-radius:3px;padding:8px 12px;font-weight:600}.welcome-actions button:first-child{background:var(--wd-blue);border-color:var(--wd-blue);color:#fff}
.day-card{padding:21px 23px}.day-card h3{font-size:20px;font-weight:400;margin:6px 0 14px;color:var(--ink-strong)}.day-stat{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--line-soft)}.day-stat span{color:var(--muted)}.day-stat b{color:var(--wd-blue);font-size:18px;font-weight:500}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.kpi-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:17px 19px;min-height:112px}.kpi-head{display:flex;align-items:center;justify-content:space-between;color:var(--muted)}.kpi-head span{font-size:21px;color:var(--wd-blue)}.kpi-head small{font-size:9px;letter-spacing:.1em}.kpi-card h3{font-size:30px;font-weight:400;color:var(--ink-strong);margin:8px 0 0}.kpi-card p{margin:0;color:var(--muted);font-size:12px}
.content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.section-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);padding:0;overflow:hidden}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 19px;border-bottom:1px solid var(--line-soft)}.section-head small{font-size:9px;letter-spacing:.1em;font-weight:700;color:var(--wd-blue)}.section-head h2{font-size:17px;font-weight:500;margin:2px 0 0;color:var(--ink-strong)}
.app-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:10px}.app-tile{display:flex;align-items:center;gap:12px;min-height:70px;border:1px solid transparent;background:transparent;text-align:left;border-radius:3px;padding:10px;color:var(--ink)}.app-tile:hover{background:#f3f8fc;border-color:#d6e7f5}.app-tile i{font-style:normal;min-width:40px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#e8f3fd;color:var(--wd-blue);font-size:19px}.app-tile b,.app-tile small{display:block}.app-tile b{font-size:13px;color:var(--ink-strong)}.app-tile small{font-size:11px;color:var(--muted);margin-top:2px}
.task-row,.quick-row{display:flex;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line-soft)}.task-row:last-child,.quick-row:last-child{border-bottom:0}.task-row>i,.quick-row>i{font-style:normal;min-width:36px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e8f3fd;color:var(--wd-blue)}.task-row>div:nth-child(2),.quick-row>div{flex:1;min-width:0}.task-row b,.task-row small,.quick-row b,.quick-row small{display:block}.task-row b,.quick-row b{color:var(--ink-strong);font-weight:600}.task-row small,.quick-row small{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.task-row em{font-style:normal;color:var(--muted);font-size:11px}

/* tables/forms */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;background:var(--surface);border:1px solid var(--line);padding:10px;border-radius:var(--radius);box-shadow:var(--shadow)}.toolbar-search{max-width:340px;background:#f3f6f8;border-color:transparent}.toolbar-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.table-wrap{overflow:auto;background:var(--surface)}table{width:100%;border-collapse:collapse}th,td{padding:11px 13px;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:middle}th{background:#f4f6f8;color:#526575;font-size:11px;font-weight:600;position:sticky;top:0;z-index:1}tbody tr:hover{background:#f7fbfe}.person-cell{display:flex;align-items:center;gap:10px}.person-avatar{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#d7ebff;color:var(--wd-blue-dark);font-weight:700}.person-cell b,.person-cell small{display:block}.person-cell small{color:var(--muted);font-size:11px}
.status{display:inline-flex;align-items:center;min-height:23px;border-radius:12px;padding:3px 9px;background:#e9eef2;color:#50606c;font-size:10px;font-weight:700}.status.approved,.status.active,.status.completed,.status.open{background:#e4f5ec;color:#177149}.status.pending,.status.in-progress,.status.in_progress,.status.waiting{background:#fff0d4;color:#8a5c00}.status.rejected,.status.cancelled,.status.overdue,.status.closed{background:#fde7e7;color:#a82727}
.empty{min-height:145px;display:grid;place-items:center;color:var(--muted);padding:20px}.empty>div{text-align:center}.empty i{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 8px;border-radius:50%;background:#eef4f9;color:var(--wd-blue);font-style:normal;font-size:22px}.empty b{font-weight:500}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid label{display:grid;gap:6px;font-weight:600;color:var(--ink-strong)}.form-grid .full{grid-column:1/-1}.form-message{min-height:18px;color:var(--wd-red)}.form-message.success{color:var(--wd-green)}
.details-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:18px}.detail-box{border:1px solid var(--line);background:var(--surface);border-radius:3px;padding:13px}.detail-box small,.detail-box b{display:block}.detail-box small{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}.detail-box b{margin-top:4px;color:var(--ink-strong)}
.metric-bars{display:grid;gap:14px;padding:18px}.metric-bar header{display:flex;justify-content:space-between;margin-bottom:6px}.metric-bar>div{height:7px;border-radius:7px;background:#e8edf1;overflow:hidden}.metric-bar>div i{display:block;height:100%;background:var(--wd-blue)}

/* profile and org */
.profile-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:14px}.profile-summary{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);padding:22px;text-align:center;border-radius:var(--radius)}.profile-large-avatar{width:90px;height:90px;border-radius:50%;display:grid;place-items:center;background:#d7ebff;color:var(--wd-blue-dark);font-size:30px;font-weight:600;margin:0 auto 12px}.profile-summary h2{font-size:20px;font-weight:500;margin:0}.profile-summary p{color:var(--muted);margin:4px 0}.profile-tags{display:flex;gap:5px;justify-content:center;flex-wrap:wrap;margin-top:13px}.profile-tags span{background:#eef4f9;color:#4c6576;border-radius:12px;padding:4px 8px;font-size:10px}.profile-tabs{display:flex;gap:0;overflow:auto;background:var(--surface);border:1px solid var(--line);border-bottom:0}.profile-tabs button{border:0;border-bottom:3px solid transparent;background:transparent;padding:12px 15px;color:var(--muted);white-space:nowrap}.profile-tabs button.active{color:var(--wd-blue);border-bottom-color:var(--wd-blue)}
.org-tree{overflow:auto;padding:20px}.org-level{display:flex;gap:18px;justify-content:center;align-items:flex-start;min-width:max-content}.org-node{width:220px;border:1px solid var(--line);background:var(--surface);border-top:4px solid var(--wd-blue);box-shadow:var(--shadow);padding:15px;text-align:center}.org-node b,.org-node small{display:block}.org-node small{color:var(--muted)}.org-children{display:flex;gap:16px;margin-top:28px}

/* overlays */
.launcher-panel{position:fixed;z-index:90;left:74px;top:67px;width:min(920px,calc(100vw - 92px));max-height:calc(100vh - 88px);overflow:auto;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-lg);border-radius:5px;padding:20px}.launcher-head,.drawer-head,.modal-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.launcher-head{padding-bottom:14px;border-bottom:1px solid var(--line)}.launcher-head small,.drawer-head span,.modal-head span{font-size:9px;letter-spacing:.1em;color:var(--wd-blue);font-weight:700}.launcher-head h2,.drawer-head h2,.modal-head h2{font-size:21px;font-weight:500;margin:2px 0}.launcher-head button,.drawer-head button,.modal-head button{border:0;background:transparent;font-size:25px;color:var(--muted)}.launcher-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding-top:14px}
.popover{position:fixed;z-index:95;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-lg);border-radius:4px}.user-menu{right:14px;top:56px;width:240px;padding:8px}.user-menu>div{padding:10px;border-bottom:1px solid var(--line-soft)}.user-menu b,.user-menu small{display:block}.user-menu small{color:var(--muted)}.user-menu button{width:100%;border:0;background:transparent;text-align:left;padding:10px;border-radius:3px;color:var(--ink)}.user-menu button:hover{background:#eef4f9}.danger-text{color:var(--wd-red)!important}
.drawer{position:fixed;z-index:100;top:0;right:0;bottom:0;width:min(430px,100vw);background:var(--surface);box-shadow:-8px 0 25px rgba(25,49,66,.2);padding:20px;overflow:auto}.drawer-head{padding-bottom:15px;border-bottom:1px solid var(--line)}.drawer-actions{display:flex;justify-content:flex-end;padding:10px 0}.drawer-actions button{border:0;background:transparent;color:var(--wd-blue)}.notification{padding:13px;border-bottom:1px solid var(--line-soft)}.notification b,.notification small{display:block}.notification small{color:var(--muted)}
.overlay{position:fixed;inset:0;z-index:80;background:rgba(13,30,43,.35)}.modal-backdrop{position:fixed;inset:0;z-index:110;background:rgba(13,30,43,.48);display:grid;place-items:center;padding:18px}.modal{width:min(760px,100%);max-height:92vh;overflow:auto;background:var(--surface);border-radius:5px;box-shadow:var(--shadow-lg);padding:22px}.modal-head{border-bottom:1px solid var(--line);padding-bottom:13px;margin-bottom:17px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.toast{position:fixed;z-index:150;left:50%;bottom:25px;transform:translateX(-50%);background:#263b4a;color:#fff;padding:11px 16px;border-radius:3px;box-shadow:var(--shadow-lg);max-width:min(620px,92vw);text-align:center}

/* responsive */
@media(max-width:1050px){.auth-layout{grid-template-columns:1fr}.auth-visual{display:none}.auth-panel{min-height:100vh}.global-search{max-width:none}.user-chip div,.task-chip b{display:none}.user-chip{min-width:52px;border-left:0;padding-left:5px}.content-grid{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.details-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){:root{--header:58px}.mobile-only{display:block}.topbar{padding:0 8px;gap:3px}.brand-btn{display:none}.launcher-btn{border-left:0}.global-search{flex:1;width:auto;margin:0}.global-search kbd{display:none}.task-chip{display:none}.top-actions{gap:0}.user-chip{min-width:44px}.user-chip>span{width:34px;height:34px}.sidebar{top:var(--header);width:min(292px,86vw);transform:translateX(-102%);box-shadow:8px 0 24px rgba(30,54,73,.23)}.sidebar.open{transform:translateX(0);width:min(292px,86vw)}.sidebar .sidebar-user div,.sidebar .nav-item b,.sidebar .connection-card>span,.sidebar .nav-group-label{opacity:1}.sidebar .nav-group-label{height:auto;margin:12px 16px 5px}.main-content{margin-left:0}.page-header{min-height:150px;padding:25px 18px 20px;align-items:flex-start;flex-direction:column;gap:13px}.page-actions{justify-content:flex-start}.page-header h1{font-size:25px}#content{padding:14px 10px 30px}.hero-workspace{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kpi-card{padding:14px}.content-grid{gap:10px}.app-grid{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar-search{max-width:none}.toolbar-filters{justify-content:flex-end}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.details-grid{grid-template-columns:1fr}.profile-layout{grid-template-columns:1fr}.launcher-panel{left:8px;right:8px;top:65px;width:auto}.launcher-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.task-row{align-items:flex-start;flex-wrap:wrap}.task-row>div:nth-child(2){min-width:calc(100% - 55px)}.auth-card{padding:28px 22px}}
@media(max-width:460px){.global-search{min-width:0}.global-search input::placeholder{color:transparent}.icon-btn:not(.mobile-only):not(.text-btn){display:none}.kpi-grid{grid-template-columns:1fr 1fr}.kpi-card h3{font-size:25px}.welcome-card{padding:20px}.launcher-grid{grid-template-columns:1fr}.auth-panel{padding:18px}.auth-card{border-radius:4px}.page-header p{font-size:12px}}
[dir="rtl"] .sidebar{left:auto;right:0;border-right:0;border-left:1px solid var(--line)}[dir="rtl"] .main-content{margin-left:0;margin-right:var(--rail)}[dir="rtl"] .nav-item{text-align:right}[dir="rtl"] .nav-item.active:before{left:auto;right:0}[dir="rtl"] .top-actions{margin-left:0;margin-right:auto}[dir="rtl"] .user-chip{border-left:0;border-right:1px solid var(--line);text-align:right}[dir="rtl"] th,[dir="rtl"] td{text-align:right}[dir="rtl"] .user-menu{right:auto;left:14px}[dir="rtl"] .drawer{right:auto;left:0}[dir="rtl"] .launcher-panel{left:auto;right:74px}@media(max-width:760px){[dir="rtl"] .sidebar{transform:translateX(102%)}[dir="rtl"] .sidebar.open{transform:translateX(0)}[dir="rtl"] .main-content{margin-right:0}[dir="rtl"] .launcher-panel{right:8px;left:8px}}

/* GYPTO HR V2.2 — Workday-style sequential time-off approval */
.approval-overview{overflow:hidden}
.approval-flow{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:0;align-items:start;min-width:560px;padding:8px 2px}
.approval-flow.large{padding:12px 4px 4px}
.approval-step{position:relative;display:flex;align-items:flex-start;gap:9px;min-width:0;padding-right:16px}
.approval-step:not(:last-child)::after{content:"";position:absolute;top:8px;left:17px;right:-3px;height:2px;background:#dce5ef;z-index:0}
.approval-step i{position:relative;z-index:1;display:block;flex:0 0 18px;width:18px;height:18px;border-radius:50%;border:3px solid #d7e1ec;background:#fff;box-shadow:0 0 0 3px #fff}
.approval-step div{position:relative;z-index:1;min-width:0;background:var(--card,#fff);padding-right:5px}
.approval-step b{display:block;font-size:12px;line-height:1.25;color:#253a4d}
.approval-step small{display:block;margin-top:3px;font-size:10px;line-height:1.3;color:#74879a}
.approval-step.done i{border-color:#20a779;background:#20a779}
.approval-step.done:not(:last-child)::after{background:#20a779}
.approval-step.active i{border-color:#1976d2;background:#fff;box-shadow:0 0 0 4px rgba(25,118,210,.13)}
.approval-step.rejected i{border-color:#d74343;background:#d74343}
.approval-step.rejected b{color:#b62f2f}
.approval-step.blocked{opacity:.55}
.leave-status-stack{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:150px}
.leave-status-stack small{max-width:200px;color:#65798c;line-height:1.35}
.status.pending-manager,.status.pending{background:#fff4d7;color:#8a5a00;border-color:#f2d188}
.status.pending-hr{background:#e9f2ff;color:#145ca8;border-color:#bad5f5}
.status.approved{background:#e8f7f0;color:#11744f;border-color:#b7e2cf}
.status.rejected{background:#fdecec;color:#a82929;border-color:#f2bebe}
.request-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:22px}
.request-detail-grid>div{padding:13px 14px;border:1px solid #e2e9f1;border-radius:12px;background:#f8fafc}
.request-detail-grid>div.wide{grid-column:1/-1}
.request-detail-grid small{display:block;margin-bottom:5px;color:#718397;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.request-detail-grid b{display:block;color:#21384c;line-height:1.4}
.approval-history{margin-top:22px;padding-top:18px;border-top:1px solid #e4eaf0}
.approval-history h3{margin:0 0 12px;color:#1f3850;font-size:16px}
.approval-history article{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:1px solid #edf1f5}
.approval-history article>i{display:grid;place-items:center;flex:0 0 25px;width:25px;height:25px;border-radius:50%;background:#eaf2fb;color:#176bb3;font-style:normal;font-weight:800}
.approval-history article b{display:block;color:#243d53;text-transform:capitalize}
.approval-history article small{display:block;margin-top:3px;color:#718397;line-height:1.4}
.dark .approval-step div{background:var(--card,#152333)}
.dark .approval-step i{box-shadow:0 0 0 3px #152333;background:#152333}
.dark .approval-step b,.dark .request-detail-grid b,.dark .approval-history h3,.dark .approval-history article b{color:#e8f0f8}
.dark .request-detail-grid>div{background:#142334;border-color:#2c4053}
.dark .approval-step:not(:last-child)::after{background:#3a4d60}
.dark .approval-step.done:not(:last-child)::after{background:#20a779}
@media(max-width:800px){.approval-flow{overflow-x:auto;grid-template-columns:repeat(4,150px);padding-bottom:10px}.request-detail-grid{grid-template-columns:1fr}.request-detail-grid>div.wide{grid-column:auto}}