/*
 * CleanRent / Rental Operations
 * Commercial interface layer: workshop precision, enamel surfaces and a
 * cobalt operational rail. Kept separate from component CSS for safe upgrades.
 */

:root{
  --blue:#286cff;
  --blue2:#1555df;
  --ink:#142033;
  --muted:#6e7c90;
  --line:#dce4ee;
  --soft:#f3f7fc;
  --nav:#0b1220;
  --green:#1fad78;
  --red:#e7505b;
  --orange:#ef7f42;
  --yellow:#eab83e;
  --purple:#7259d9;
  --radius:16px;
  --shadow:0 16px 40px rgba(18,39,68,.08),0 2px 8px rgba(18,39,68,.035);
  --display:"Aptos Display","Segoe UI Variable Display","Segoe UI",sans-serif;
  --body:"Inter","Segoe UI Variable Text","Segoe UI",sans-serif;
  --utility:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}

*{scrollbar-color:#bdc9d8 transparent;scrollbar-width:thin}
::selection{background:#cfe0ff;color:#0c347d}
html,body{font-family:var(--body);background:#070d17;color:var(--ink);font-size:14px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font-family:var(--body)}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid rgba(40,108,255,.28)!important;outline-offset:2px}

/* Workspace shell */
.app-shell{
  grid-template-columns:224px minmax(0,1fr);
  gap:10px;
  padding:10px;
  background:
    radial-gradient(circle at 8% 10%,rgba(40,108,255,.13),transparent 26%),
    linear-gradient(145deg,#080f1b,#101c2d 58%,#0a1321);
}
.sidebar{
  min-height:calc(100vh - 20px);
  padding:25px 17px 17px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:22px;
  background:linear-gradient(180deg,rgba(18,33,55,.96),rgba(9,17,30,.98));
  box-shadow:inset 0 1px rgba(255,255,255,.06),0 24px 60px rgba(0,0,0,.2);
}
.brand{height:auto;min-height:48px;padding:0 8px 24px;gap:12px;font-family:var(--display)}
.brand-mark,.login-logo span{
  position:relative;width:34px;height:34px;border-radius:11px;
  background:#286cff;color:#fff;font-size:11px;letter-spacing:-.04em;
  box-shadow:0 9px 24px rgba(40,108,255,.34),inset 0 1px rgba(255,255,255,.4);
}
.brand-mark::after,.login-logo span::after{content:"";position:absolute;inset:6px;border:1px solid rgba(255,255,255,.48);border-radius:5px}
.brand-copy{display:flex;flex-direction:column;gap:1px;min-width:0}
.brand-copy strong{font-size:16px;letter-spacing:-.025em}
.brand-copy small{font:600 7px/1.2 var(--utility);letter-spacing:.14em;text-transform:uppercase;color:#8191a8}
.sidebar nav{gap:4px}
.sidebar .nav-item{
  position:relative;min-height:44px;padding:11px 12px;border-radius:11px;
  color:#aebbd0;font-size:12px;font-weight:600;letter-spacing:-.01em;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.sidebar .nav-item svg{width:18px;height:18px;stroke-width:1.7}
.sidebar .nav-item:hover{background:rgba(255,255,255,.055);color:#fff;transform:translateX(2px)}
.sidebar .nav-item.active{
  background:rgba(40,108,255,.14);color:#fff;box-shadow:inset 0 0 0 1px rgba(87,145,255,.22);
}
.sidebar .nav-item.active::before{content:"";position:absolute;left:-17px;top:10px;bottom:10px;width:3px;border-radius:0 4px 4px 0;background:#4f8cff;box-shadow:0 0 14px #286cff}
.sidebar .nav-item.divider{margin-top:17px}
.sidebar .nav-item.divider::after{content:"";position:absolute;left:10px;right:10px;top:-11px;height:1px;background:rgba(255,255,255,.07)}
.profile{margin-top:auto;padding:17px 5px 1px;border-top-color:rgba(255,255,255,.08)}
.profile .avatar{background:#edf3ff;color:#1d58bd;border:2px solid rgba(255,255,255,.18);font-family:var(--display)}
.profile strong{color:#f7faff;font-size:11px}.profile span{color:#74859d;font:600 8px var(--utility);letter-spacing:.04em;text-transform:uppercase}
.main{
  position:relative;min-height:calc(100vh - 20px);border-radius:22px;overflow:hidden;
  background:
    linear-gradient(rgba(28,70,125,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(28,70,125,.022) 1px,transparent 1px),
    #f3f7fc;
  background-size:32px 32px;
  box-shadow:0 20px 70px rgba(0,0,0,.2);
}
.page{padding:29px 28px 28px;max-width:1660px}
.page-head{min-height:55px;margin-bottom:18px}
.page-title{display:flex;flex-direction:column-reverse;gap:4px}
.page-head h1{font:720 27px/1.05 var(--display);letter-spacing:-.04em;color:#101b2c}
.page-kicker{font:700 8px/1.2 var(--utility);letter-spacing:.12em;text-transform:uppercase;color:#74849a}
.page-actions{gap:8px}

/* Controls */
.button{
  min-height:40px;padding:9px 14px;border-color:#d7e0eb;border-radius:11px;
  color:#26364c;background:rgba(255,255,255,.88);font-size:11px;font-weight:700;
  box-shadow:0 2px 5px rgba(20,42,72,.035);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;
}
.button:hover{border-color:#b9c8db;background:#fff;box-shadow:0 7px 18px rgba(22,48,82,.09);transform:translateY(-1px)}
.button:active{transform:translateY(0);box-shadow:none}
.button.primary{
  color:#fff;border-color:#286cff;background:#286cff;
  box-shadow:0 9px 20px rgba(40,108,255,.23),inset 0 1px rgba(255,255,255,.24);
}
.button.primary:hover{background:#1d61ed;border-color:#1d61ed;filter:none}
.button.danger{color:#ca3946;background:#fff7f8;border-color:#f3ccd0}
.button.success{background:#1fad78;border-color:#1fad78}.button.orange{background:#ef7f42;border-color:#ef7f42}
.button.small{min-height:34px;padding:7px 10px}
.icon-button{min-width:34px;min-height:34px;border-radius:10px;transition:background .16s,color .16s,transform .16s}
.icon-button:hover{background:#edf3fa;color:#205fd0;transform:translateY(-1px)}
.segmented{padding:3px;border-color:#d8e1ec;border-radius:12px;background:#eaf0f7;box-shadow:inset 0 1px 3px rgba(23,45,74,.05)}
.segmented button{min-height:33px;padding:7px 15px;border:0!important;border-radius:9px;background:transparent;color:#6a788b;font-weight:650}
.segmented button.active{color:#174ba7;background:#fff;box-shadow:0 3px 9px rgba(28,52,82,.1)}
.date-label{min-height:40px;display:flex;align-items:center;border-color:#d7e0eb;border-radius:11px;background:#fff;font-weight:700;color:#26364c}
.field,input,select,textarea{
  min-height:42px;border-color:#d6e0eb;border-radius:11px;background:#fff;color:#162338;padding:10px 12px;
  box-shadow:inset 0 1px 2px rgba(18,42,72,.025);transition:border .16s,box-shadow .16s,background .16s;
}
.field:hover,input:hover,select:hover,textarea:hover{border-color:#bfcddd}
.field:focus,input:focus,select:focus,textarea:focus{border-color:#6197ff;box-shadow:0 0 0 4px rgba(40,108,255,.1)}
label{gap:7px;color:#5b6a7f;font-size:10px;font-weight:700;letter-spacing:.005em}
textarea{min-height:92px}
.searchbar{min-width:260px}.searchbar svg{left:13px;top:12px;color:#7d8da2}.searchbar input{padding-left:41px;background:rgba(255,255,255,.82)}

/* Surfaces and operational rail */
.card,.side-card,.schedule{
  border-color:#dae3ed;border-radius:17px;background:rgba(255,255,255,.93);
  box-shadow:var(--shadow);
}
.entity-card{position:relative;min-height:166px;padding:18px;overflow:hidden}
.entity-card::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 4px 4px 0;background:#d6e1ee;transition:background .16s,top .16s,bottom .16s}
.entity-card:hover{border-color:#b8cce6;box-shadow:0 18px 34px rgba(24,55,94,.12);transform:translateY(-2px)}
.entity-card:hover::before{top:12px;bottom:12px;background:#286cff}
.entity-card h3{font:700 15px/1.2 var(--display);letter-spacing:-.025em}
.entity-card p{color:#718096;font-size:10px}
.entity-card .meta{border-top-color:#e4eaf1;color:#718096}
.equipment-thumb{border:1px solid #dce4ed;border-radius:12px;background:#edf3f8;color:#426080}
.client-avatar{border-radius:14px;background:#172842;font:700 16px var(--display);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.chip,.status{border-radius:7px;padding:5px 8px;font-size:9px;font-weight:750;letter-spacing:.01em}
.chip{border-color:#e0e7ef;background:#f1f5f9}.chip.blue{background:#e9f1ff;color:#195ac5;border-color:#d8e6ff}
.chip.green,.status.ready,.status.closed,.status.paid,.status.rented{background:#e8f7f1;color:#117653}
.chip.red,.status.cancelled,.status.overdue{background:#fff0f1;color:#bb3442}
.status.unpaid,.status.awaiting_payment{background:#fff4d8;color:#8b650d}
.status.issuing,.status.contract_ready{background:#efedff;color:#5f49bd}.status.returning{background:#fff0e6;color:#b8511d}
.status.cleaning{background:#edf1f5;color:#596779}
.list{border-radius:17px}.list-row{padding:15px 17px;border-bottom-color:#e5ebf2;font-size:10px;transition:background .13s}
.list-row:not(.header):hover{background:#f5f8fc}
.list-row.header{background:#edf3f9;color:#6d7c91;font:700 8px var(--utility);letter-spacing:.08em;text-transform:uppercase}
.list-row strong{font-size:11px;color:#1c2a3e}
.empty{border:1px dashed #cdd8e5;border-radius:16px;background:rgba(255,255,255,.5);color:#77869a}
.section-title{margin-top:24px;padding-bottom:10px;border-bottom-color:#dce4ee;font:720 13px var(--display);letter-spacing:-.015em;color:#26364b}

/* Calendar: the operational rail */
.calendar-layout{gap:16px;grid-template-columns:minmax(0,1fr) 250px}
.schedule{overflow:hidden}
.schedule-grid{grid-template-columns:176px repeat(7,minmax(94px,1fr))}
.schedule-cell{border-color:#e4eaf1;min-height:90px;padding:8px}
.schedule-head{min-height:58px;background:#f8fafc;color:#45556b;font:700 9px var(--utility);letter-spacing:.08em;text-transform:uppercase}
.schedule-head span{margin-top:5px;font:600 9px var(--body);letter-spacing:0;text-transform:none;color:#8995a5}
.schedule-head.today b{width:auto;height:25px;padding:0 8px;border-radius:7px;background:#286cff;box-shadow:0 5px 12px rgba(40,108,255,.23)}
.equipment-label{padding:11px;background:#fff}.equipment-label strong{font-size:10px}.equipment-label span{font:600 8px var(--utility);letter-spacing:.04em}
.booking-block{
  min-height:64px;padding:8px 9px 8px 12px;border:1px solid rgba(25,55,90,.07);border-left:4px solid currentColor;border-radius:9px;
  box-shadow:0 5px 14px rgba(22,47,78,.09);font-size:9px;background:#edf3fb!important;color:#315a91;
}
.booking-block strong{font-size:9px;color:#17283e}.booking-block small{opacity:.74}
.booking-block.unpaid{color:#a77709;background:#fff4d2!important}.booking-block.rented{color:#14805d;background:#e8f8f1!important}
.booking-block.issuing{color:#6952c7;background:#efedff!important}.booking-block.returning{color:#c15b27;background:#fff0e7!important}
.booking-block.overdue{color:#c73f4c;background:#ffedef!important}.booking-block.cleaning{color:#68778a;background:#eef2f6!important}
.side-stack{gap:13px}.side-card{padding:17px}.side-card h3{font:720 14px var(--display);letter-spacing:-.02em}
.mini-calendar{gap:5px}.mini-calendar .selected{border-radius:7px;background:#286cff;box-shadow:0 4px 10px rgba(40,108,255,.22)}
.stats-row{gap:12px;margin-top:16px}.stat-card{position:relative;min-height:108px;padding:18px;overflow:hidden}
.stat-card::before{content:"";position:absolute;left:0;top:18px;height:28px;width:3px;border-radius:0 4px 4px 0;background:#286cff}
.stat-card.red::before{background:#e7505b}.stat-card.green::before{background:#1fad78}
.stat-card .label{color:#6a788b!important;font:700 8px var(--utility);letter-spacing:.07em;text-transform:uppercase}
.stat-card strong{margin:10px 0 5px;font:760 24px var(--display);letter-spacing:-.045em;color:#152238}

/* Details, dashboards and modals */
.detail-shell{max-width:880px;min-height:calc(100vh - 20px);background:#fff;border-radius:22px;box-shadow:0 18px 55px rgba(16,39,69,.1);overflow:hidden}
.detail-head{height:66px;padding:0 22px;border-color:#e1e8f0;background:rgba(248,250,253,.9)}
.detail-head h1{font:720 16px var(--display);letter-spacing:-.025em}
.detail-content{padding:22px}.hero{gap:20px;padding-bottom:21px;border-color:#e1e8f0}.hero h2{font:740 24px/1.1 var(--display);letter-spacing:-.04em}
.hero .equipment-thumb{border-radius:16px;background:#eef3f8}
.detail-tabs{gap:5px;padding:0 22px;margin:0 -22px 19px;background:#fbfcfe}.detail-tabs button{padding:15px 12px;color:#6f7d90;font-weight:650}
.detail-tabs button.active{color:#1d5dcc;border-bottom-color:#286cff}
.key-row{padding:12px 0;border-color:#e4eaf1}.key-row span:first-child{color:#718096}
.quick-actions{gap:10px;margin-top:21px}.quick-action{min-height:88px;border-color:#dce4ee;border-radius:13px;background:#f7f9fc;font-weight:650;transition:.16s}
.quick-action:hover{border-color:#a9c4e8;background:#f0f6ff;transform:translateY(-2px)}
.quick-action svg{color:#286cff}.quick-action.primary-quick{border-color:#a8c6f1;background:#edf4ff;color:#1959bd}
.metric{position:relative;border-radius:17px;padding:19px;overflow:hidden}.metric h3{font:700 8px var(--utility);letter-spacing:.08em;text-transform:uppercase}
.metric strong{font:760 25px var(--display);letter-spacing:-.045em}.metric .trend{border-radius:6px}
.chart svg{stroke:#286cff}.bar{background:#e7edf4}.bar i{background:#286cff}
.modal-backdrop{padding:22px;background:rgba(5,12,22,.61);backdrop-filter:blur(8px)}
.modal{border:1px solid rgba(255,255,255,.68);border-radius:20px;box-shadow:0 35px 90px rgba(3,12,24,.38)}
.modal-head{min-height:62px;padding:17px 22px;background:#f8fafc;border-color:#e0e7ef}.modal-head h2{font:730 17px var(--display);letter-spacing:-.025em}
.modal-body{padding:22px}.modal-foot{padding:14px 22px;background:#f8fafc;border-color:#e0e7ef}
.selector-list{border-color:#d9e2ec;border-radius:13px}.selector-row{min-height:48px;border-color:#e4eaf1}.selector-row:hover{background:#f3f7fc}
.booking-choice{min-height:78px;border-color:#d9e2ec;border-radius:13px;background:#f8fafc;padding:13px}
.booking-choice:has(>input:first-child:checked){border-color:#286cff;background:#edf4ff;box-shadow:0 0 0 3px rgba(40,108,255,.09)}
.booking-choice:has(>input:first-child:checked)::after{background:#286cff}
.toast{border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#15243a;box-shadow:0 15px 40px rgba(4,12,23,.26);font-weight:650}

/* Login thesis */
.login-screen{
  grid-template-columns:minmax(440px,1.15fr) minmax(390px,.85fr);gap:clamp(40px,7vw,110px);
  min-height:100vh;padding:clamp(28px,5vw,72px);background:#0b1220;overflow:hidden;
}
.login-story{
  position:relative;align-self:stretch;min-height:600px;padding:42px 48px;border:1px solid rgba(255,255,255,.08);border-radius:28px;overflow:hidden;color:#fff;
  background:
    linear-gradient(rgba(102,151,230,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(102,151,230,.07) 1px,transparent 1px),
    radial-gradient(circle at 80% 25%,rgba(40,108,255,.29),transparent 34%),
    linear-gradient(150deg,#12233b,#0c1728);
  background-size:36px 36px,36px 36px,auto,auto;
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 35px 90px rgba(0,0,0,.25);
}
.login-story::after{content:"";position:absolute;width:420px;height:420px;right:-115px;top:70px;border:1px solid rgba(100,154,255,.22);border-radius:50%;box-shadow:0 0 0 42px rgba(100,154,255,.035),0 0 0 96px rgba(100,154,255,.025)}
.login-story-brand{position:relative;z-index:1;display:grid;grid-template-columns:37px auto;grid-template-rows:1fr 1fr;column-gap:11px;align-items:center}
.login-story-brand>span{grid-row:1/3;width:37px;height:37px;display:grid;place-items:center;border-radius:11px;background:#286cff;font:800 11px var(--display);box-shadow:0 9px 25px rgba(40,108,255,.32)}
.login-story-brand strong{align-self:end;font:740 17px var(--display)}.login-story-brand small{align-self:start;color:#8293aa;font:600 7px var(--utility);letter-spacing:.13em;text-transform:uppercase}
.login-story-copy{position:relative;z-index:1;max-width:650px;margin-top:clamp(120px,20vh,210px)}
.login-kicker{display:block;margin-bottom:18px;color:#7fa8ff;font:700 9px var(--utility);letter-spacing:.14em;text-transform:uppercase}
.login-story h2{margin:0;font:730 clamp(42px,5vw,76px)/.95 var(--display);letter-spacing:-.065em}.login-story h2 em{color:#75a3ff;font-style:normal;font-weight:560}
.login-story-copy p{max-width:490px;margin:25px 0 0;color:#a9b7ca;font-size:14px;line-height:1.7}
.login-story-rail{position:absolute;z-index:1;left:48px;right:48px;bottom:43px;display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:13px;color:#8ea0b8;font:650 8px var(--utility);letter-spacing:.08em;text-transform:uppercase}
.login-story-rail i{height:2px;background:linear-gradient(90deg,#286cff,#6d9dff);position:relative}.login-story-rail i::after{content:"";position:absolute;right:-2px;top:-3px;width:8px;height:8px;border-radius:50%;background:#6d9dff;box-shadow:0 0 12px #286cff}
.login-panel{width:min(410px,100%);padding:42px 38px;border:1px solid #dce5f0;border-radius:24px;background:#fff;box-shadow:0 35px 90px rgba(0,0,0,.28)}
.login-logo{justify-content:flex-start;margin-bottom:32px;font-family:var(--display)}.login-logo strong{font-size:18px;letter-spacing:-.03em}.login-logo span{width:34px;height:34px}
.login-workspace-label{margin-bottom:13px;color:#286cff;font:700 8px var(--utility);letter-spacing:.1em;text-transform:uppercase}
.login-panel h1{text-align:left;font:740 28px/1.1 var(--display);letter-spacing:-.045em}.login-panel>p{text-align:left;margin-top:7px;margin-bottom:28px;font-size:11px}
.login-panel form{gap:16px}.login-panel .button{min-height:46px;margin-top:3px}

/* Motion is concentrated on workspace entry and interactive elevation. */
@keyframes workspace-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.app-shell:not(.hidden) .main{animation:workspace-in .32s cubic-bezier(.2,.8,.2,1)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

@media(max-width:1150px){
  .app-shell{grid-template-columns:205px minmax(0,1fr)}
  .calendar-layout{grid-template-columns:1fr}.schedule-grid{grid-template-columns:156px repeat(7,minmax(88px,1fr))}
  .login-screen{gap:35px;padding:35px}.login-story{padding:36px}.login-story-rail{left:36px;right:36px}
}

@media(max-width:820px){.login-screen{display:grid;grid-template-columns:1fr}.login-story{display:none}.login-panel{justify-self:center}}

@media(max-width:760px){
  html,body{background:#eef3f9}
  .app-shell{display:block;padding:0;background:#eef3f9}
  .main{min-height:100dvh;padding-bottom:calc(88px + env(safe-area-inset-bottom));border-radius:0;background:#f3f7fc;box-shadow:none}
  .page{padding:18px 13px 22px}
  .page-head{min-height:50px;margin-bottom:14px;align-items:flex-end}.page-head h1{font-size:24px}.page-kicker{font-size:7px}
  .page-actions{gap:6px}.page-actions .button{min-height:38px;padding:8px 11px}
  .mobile-nav{
    left:8px;right:8px;bottom:8px;height:calc(67px + env(safe-area-inset-bottom));padding:3px 3px env(safe-area-inset-bottom);
    border:1px solid rgba(207,218,232,.92);border-radius:19px;background:rgba(255,255,255,.94);
    box-shadow:0 16px 45px rgba(13,31,56,.18);backdrop-filter:blur(20px);overflow:hidden;
  }
  .mobile-nav .nav-item{position:relative;min-height:60px;border-radius:14px;color:#718096;font-size:9px;font-weight:700}
  .mobile-nav .nav-item.active{color:#1c5fd2;background:#edf4ff}
  .mobile-nav .nav-item.active::after{content:"";position:absolute;bottom:3px;width:16px;height:3px;border-radius:3px;background:#286cff}
  .mobile-nav svg{width:20px;height:20px}
  .topbar{gap:9px;margin-bottom:13px}.topbar-left,.topbar-right{gap:7px}
  .button{min-height:42px}.date-label{min-height:42px}
  .card,.side-card,.schedule{border-radius:15px;box-shadow:0 8px 23px rgba(21,48,82,.065)}
  .entity-card{min-height:0;padding:16px}.entity-card::before{top:14px;bottom:14px}
  .client-avatar{border-radius:13px}.stats-row{gap:8px}.stat-card{min-height:99px;padding:15px}.stat-card strong{font-size:21px}
  .detail-shell{min-height:100dvh;border-radius:0;box-shadow:none}.detail-head{height:58px;padding:0 15px}.detail-content{padding:15px}
  .hero{gap:14px}.hero h2{font-size:21px}.detail-tabs{margin:0 -15px 16px;padding:0 15px;overflow:auto}.detail-tabs button{white-space:nowrap}
  .key-row{grid-template-columns:126px minmax(0,1fr);gap:12px}.quick-action{min-height:78px}
  .modal-backdrop{padding:0;align-items:end;background:rgba(5,12,22,.58)}
  .modal,.modal.large{width:100%;max-height:94dvh;border-radius:22px 22px 0 0;border-bottom:0}
  .modal-head{min-height:60px;padding:15px 16px}.modal-body{padding:17px 14px}.modal-foot{padding:11px 14px calc(11px + env(safe-area-inset-bottom))}.modal-foot .button{flex:1}
  .form-grid{gap:14px}.booking-choice{min-height:74px}
  .mobile-agenda-day{border-radius:15px;box-shadow:0 8px 22px rgba(21,48,82,.065)}
  .mobile-agenda-head{background:#f6f9fd}.mobile-agenda-item{min-height:66px}
  .month-board{border-radius:15px!important;box-shadow:0 8px 23px rgba(21,48,82,.065)}
  .toast-root{bottom:calc(91px + env(safe-area-inset-bottom))}.toast{font-size:12px}
}

@media(max-width:430px){
  .page-head{gap:10px;flex-wrap:wrap}.page-head h1{font-size:23px}.page-head:has(.page-actions>:first-child){align-items:flex-start;flex-direction:column}.page-actions:has(>:first-child){display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));width:100%}.page-actions .button{display:inline-flex!important;white-space:normal}.page-actions .button.primary{padding-left:10px;padding-right:10px}
  .searchbar{min-width:0}.segmented button{padding-left:8px;padding-right:8px}
  .analytics-grid{gap:8px}.metric{padding:15px}.metric strong{font-size:21px}
  .login-screen{min-height:100dvh;padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom));background:#f3f7fc}
  .login-panel{padding:29px 24px;border-radius:21px;box-shadow:0 18px 55px rgba(16,38,68,.13)}
  .login-logo{margin-bottom:34px}.login-panel h1{font-size:27px}
}
