:root{--ink:#edf2fa;--muted:#94a2b8;--navy:#101b2e;--panel:#192841;--line:rgba(237,242,250,.13);--blue:#75a7ff;--mint:#72e1bd;--orange:#ffb56b;--sans:'Manrope',sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:#101b2e;color:var(--ink);font-family:var(--sans)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:3px}.sidebar{position:fixed;inset:0 auto 0 0;width:244px;padding:31px 22px;background:#0c1627;border-right:1px solid var(--line)}.brand{display:block;color:var(--ink);font:800 1.05rem var(--mono);letter-spacing:-.08em;text-decoration:none}.brand span{color:var(--mint)}.workspace{margin:43px 0 23px;color:#75839a;font:.62rem var(--mono);letter-spacing:.12em}.sidebar nav{display:grid;gap:5px}.sidebar nav a{padding:11px 12px;border-radius:5px;color:#a7b2c2;text-decoration:none;font-size:.78rem;font-weight:700}.sidebar nav a.active,.sidebar nav a:hover{background:#1b2b45;color:#fff}.sidebar nav span{float:right;padding:1px 6px;border-radius:99px;background:#75a7ff;color:#10203a;font:.6rem var(--mono)}.demo-badge{position:absolute;right:22px;bottom:30px;left:22px;padding:14px;border:1px solid var(--line);background:#122039}.demo-badge strong{color:var(--mint);font:.63rem var(--mono);text-transform:uppercase}.demo-badge p{margin:8px 0 0;color:var(--muted);font-size:.67rem;line-height:1.5}main{max-width:1320px;margin-left:244px;padding:0 52px 90px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:34px 0}.eyebrow{margin:0 0 10px;color:#8da0bf;font:.62rem var(--mono);letter-spacing:.13em}.topbar h1{margin:0;font-size:clamp(1.5rem,3vw,2.25rem);letter-spacing:-.06em}.user{display:flex;gap:11px;align-items:center}.user>span,.avatar{display:grid;width:37px;height:37px;place-items:center;border-radius:50%;background:#315583;color:#dce8ff;font:.66rem var(--mono)}.user strong,.user small{display:block}.user strong{font-size:.72rem}.user small{margin-top:3px;color:var(--muted);font-size:.6rem}.hero-card{display:flex;justify-content:space-between;min-height:320px;padding:43px 48px;background:radial-gradient(circle at 88% 18%,rgba(83,147,189,.47),transparent 22%),linear-gradient(120deg,#1c3556,#15233b);border:1px solid var(--line)}.hero-card h2{margin:0;font-size:clamp(2.5rem,5vw,5.2rem);line-height:.94;letter-spacing:-.085em}.hero-card>div>p:not(.eyebrow){max-width:440px;margin:25px 0;color:#b9c8dc;font-size:.85rem;line-height:1.7}.primary,.secondary,.approve,.reject{border:0;border-radius:4px;padding:12px 15px;font-size:.72rem;font-weight:800}.primary,.approve{background:var(--mint);color:#0d2730}.primary:hover,.approve:hover{background:#a2f3d7}.hero-stat{align-self:flex-end;width:180px;padding:19px;border:1px solid rgba(237,242,250,.2);background:rgba(10,20,35,.28)}.hero-stat span,.hero-stat small,.hero-stat p{display:block;color:#b5c2d4;font-size:.65rem}.hero-stat strong{display:block;margin:12px 0 0;font-size:3.5rem;line-height:.8;letter-spacing:-.08em}.hero-stat small{margin-top:5px}.hero-stat p{margin:19px 0 0;padding-top:12px;border-top:1px solid var(--line)}.balance-heading,.section-title{display:flex;justify-content:space-between;align-items:end;margin:76px 0 25px}.balance-heading h2,.section-title h2{margin:0;font-size:1.5rem;letter-spacing:-.055em}.balance-heading p,.section-title>p{margin:7px 0 0;color:var(--muted);font-size:.72rem}.balance-heading>span{color:var(--muted);font:.6rem var(--mono)}.balances{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.balances article{padding:20px;border:1px solid var(--line);background:#14223a}.balances span,.balances small{display:block;color:var(--muted);font-size:.67rem}.balances strong{display:block;margin:23px 0 2px;font-size:2.6rem;letter-spacing:-.08em}.balances i{display:block;height:5px;margin-top:21px;background:#293952}.balances b{display:block;height:100%;background:var(--blue)}.section{padding-top:1px}.text-button{border:0;border-bottom:1px solid var(--blue);padding:0;background:none;color:#b9d0ff;font:.68rem var(--mono)}.request-list,.approval-list{display:grid;gap:10px}.request-row{display:grid;grid-template-columns:40px 1.3fr 1fr auto;gap:17px;align-items:center;padding:17px 20px;border:1px solid var(--line);background:#14223a}.request-icon{display:grid;width:35px;height:35px;place-items:center;border-radius:4px;background:#263c60;color:#b8d0ff;font:.75rem var(--mono)}.request-row strong,.request-row span{display:block}.request-row strong{font-size:.78rem}.request-row span,.request-row p{margin:4px 0 0;color:var(--muted);font-size:.67rem}.status{padding:6px 8px;border-radius:99px;font:.57rem var(--mono);text-transform:uppercase}.approved{background:rgba(114,225,189,.14);color:var(--mint)}.pending-hr,.pending-manager{background:rgba(117,167,255,.14);color:#a8c4ff}.rejected{background:rgba(255,110,112,.14);color:#ff9c9d}.approvals{padding-bottom:20px}.approval-card{display:flex;gap:15px;align-items:center;padding:20px;border:1px solid var(--line);background:#14223a}.approval-main{flex:1}.approval-main>div{display:flex;justify-content:space-between}.approval-main strong{font-size:.78rem}.approval-main span,.approval-main p,.approval-main small{color:var(--muted);font-size:.65rem}.approval-main h3{margin:17px 0 4px;font-size:1rem;letter-spacing:-.04em}.approval-main p{margin:0}.approval-main small{display:block;margin-top:13px}.approval-actions{display:flex;gap:7px}.reject{border:1px solid var(--line);background:transparent;color:#c5cfdf}.reject:hover{border-color:#ff9c9d;color:#ff9c9d}dialog{width:min(670px,calc(100% - 32px));border:1px solid var(--line);background:#172741;color:var(--ink);box-shadow:0 28px 80px rgba(0,0,0,.55)}dialog::backdrop{background:rgba(4,9,16,.75)}dialog form{padding:30px}.dialog-title{display:flex;justify-content:space-between}.dialog-title h2{margin:0;font-size:1.75rem;letter-spacing:-.06em}.dialog-title button{border:0;background:none;color:var(--ink);font-size:1.6rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:35px}.form-grid label{display:grid;gap:7px;color:#bac6d8;font:.65rem var(--mono)}.form-grid input,.form-grid select{border:1px solid var(--line);border-radius:4px;padding:11px;background:#101e35;color:var(--ink)}.form-message{color:var(--muted);font-size:.67rem;line-height:1.6}.dialog-actions{display:flex;justify-content:end;gap:8px;margin-top:27px}.secondary{border:1px solid var(--line);background:transparent;color:var(--ink)}@media(max-width:850px){.sidebar{position:static;width:auto;height:auto;padding:20px}.workspace,.demo-badge{display:none}.sidebar nav{display:flex;margin-top:17px}.sidebar nav a{font-size:.65rem}main{margin:0;padding:0 22px 60px}.topbar{padding:27px 0}.hero-card{min-height:0;padding:30px;flex-direction:column;gap:35px}.hero-stat{align-self:auto}.balances{grid-template-columns:1fr}.request-row{grid-template-columns:40px 1fr}.request-row p{display:none}.request-row .status{justify-self:start}.approval-card{align-items:start;flex-wrap:wrap}.approval-actions{width:100%;margin-left:52px}.form-grid{grid-template-columns:1fr}}
.portfolio-link{display:block;margin:-13px 12px 25px;color:#a7b2c2;font-size:.67rem;font-weight:700;text-decoration:none}.portfolio-link:hover{color:var(--mint)}@media(max-width:850px){.portfolio-link{margin:0 0 16px}}
@media(min-width:851px){.sidebar{position:static;width:100%;height:88px;padding:0 max(32px,calc((100% - 1280px)/2));display:flex;align-items:center;border-right:0;border-bottom:1px solid var(--line)}.sidebar .brand{flex:none}.sidebar .workspace{margin:0 0 0 26px}.sidebar nav{display:flex;gap:3px;margin-left:42px}.sidebar nav a{padding:9px 10px}.sidebar .demo-badge{position:static;display:block;max-width:156px;margin-left:20px;padding:8px 10px}.sidebar .demo-badge p{display:none}.sidebar .portfolio-link{margin:0 0 0 auto;color:#c2cddd;white-space:nowrap}.sidebar .portfolio-link:hover{color:var(--mint)}main{max-width:1280px;margin:0 auto;padding:0 32px 90px}.topbar{padding:42px 0}.user{margin-left:auto}}
@media(min-width:1200px){.sidebar{padding-inline:max(48px,calc((100% - 1440px)/2))}main{max-width:1440px;padding-inline:48px}.hero-card{padding:52px 58px}.balances{gap:18px}.request-row,.approval-card{padding:22px 26px}}
