/* ==========================================================================
   RP Business OS 4.0 – Design & Usability Final Edition
   Layered on top of UI 2.5 / UX V3 / Platform V3.1.
   No SQL migration required.
   ========================================================================== */

:root{
  --v4-bg:#06111d;
  --v4-bg-2:#0a1826;
  --v4-surface:rgba(12,29,45,.84);
  --v4-surface-solid:#0c1d2d;
  --v4-surface-soft:rgba(255,255,255,.028);
  --v4-surface-hover:rgba(255,255,255,.05);
  --v4-text:#e9f2fa;
  --v4-muted:#829bb2;
  --v4-line:rgba(139,181,215,.13);
  --v4-line-strong:rgba(139,181,215,.23);
  --v4-success:#62d8a1;
  --v4-warning:#e9c76c;
  --v4-danger:#f18aa2;
  --v4-info:#8ccfff;
  --v4-shadow:0 18px 55px rgba(0,0,0,.23);
  --v4-shadow-soft:0 10px 34px rgba(0,0,0,.16);
  --v4-radius:18px;
  --v4-radius-sm:12px;
  --v4-topbar-h:66px;
  --v4-ease:cubic-bezier(.22,.76,.22,1);
}

/* Theme setup */
html{background:var(--v4-bg)}
body{
  color:var(--v4-text);
  background:
    radial-gradient(circle at 75% -20%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 40%),
    radial-gradient(circle at 10% 30%,color-mix(in srgb,var(--accent) 5%,transparent),transparent 33%),
    var(--v4-bg);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.009) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 75%);
}
html[data-v4-theme="light"]{
  --v4-bg:#eef4f8;
  --v4-bg-2:#f7fafc;
  --v4-surface:rgba(255,255,255,.88);
  --v4-surface-solid:#ffffff;
  --v4-surface-soft:rgba(25,55,80,.035);
  --v4-surface-hover:rgba(25,55,80,.065);
  --v4-text:#152739;
  --v4-muted:#61788d;
  --v4-line:rgba(31,62,88,.12);
  --v4-line-strong:rgba(31,62,88,.22);
  --v4-shadow:0 18px 48px rgba(47,74,97,.12);
  --v4-shadow-soft:0 8px 28px rgba(47,74,97,.09);
}
html[data-v4-theme="light"] body{
  color:var(--v4-text);
  background:
    radial-gradient(circle at 75% -20%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 40%),
    var(--v4-bg);
}
html[data-v4-theme="light"] body:before{background-image:linear-gradient(rgba(31,62,88,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(31,62,88,.02) 1px,transparent 1px)}
html[data-v4-theme="light"] .app-sidebar,
html[data-v4-theme="light"] .app-topbar,
html[data-v4-theme="light"] .command-palette,
html[data-v4-theme="light"] .ui25-quick-menu,
html[data-v4-theme="light"] .ui25-mobile-dock,
html[data-v4-theme="light"] .v4-modal,
html[data-v4-theme="light"] .v4-tour-card{background:rgba(249,252,254,.96);color:var(--v4-text)}
html[data-v4-theme="light"] .card,
html[data-v4-theme="light"] .my-day-section,
html[data-v4-theme="light"] .identity-hero{background:var(--v4-surface);color:var(--v4-text)}
html[data-v4-theme="light"] input,
html[data-v4-theme="light"] select,
html[data-v4-theme="light"] textarea{background:#fff;color:#173047;border-color:var(--v4-line)}
html[data-v4-theme="light"] .side-nav a,
html[data-v4-theme="light"] .top-user-meta strong,
html[data-v4-theme="light"] .page-chip strong,
html[data-v4-theme="light"] .ui25-breadcrumbs strong{color:#20384d}
html[data-v4-theme="light"] table,
html[data-v4-theme="light"] th,
html[data-v4-theme="light"] td{color:#20384d}
html[data-v4-theme="light"] th{background:rgba(241,247,250,.94)}
html[data-v4-theme="light"] .access-matrix-table .sticky-user-col{background:#f7fafc}

/* Automatic system theme */
@media(prefers-color-scheme:light){
  html[data-v4-theme="system"]{
    --v4-bg:#eef4f8;--v4-bg-2:#f7fafc;--v4-surface:rgba(255,255,255,.88);
    --v4-surface-solid:#fff;--v4-surface-soft:rgba(25,55,80,.035);--v4-surface-hover:rgba(25,55,80,.065);
    --v4-text:#152739;--v4-muted:#61788d;--v4-line:rgba(31,62,88,.12);--v4-line-strong:rgba(31,62,88,.22);
  }
  html[data-v4-theme="system"] body{color:var(--v4-text);background:radial-gradient(circle at 75% -20%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 40%),var(--v4-bg)}
  html[data-v4-theme="system"] .app-sidebar,
  html[data-v4-theme="system"] .app-topbar,
  html[data-v4-theme="system"] .command-palette,
  html[data-v4-theme="system"] .ui25-quick-menu,
  html[data-v4-theme="system"] .ui25-mobile-dock,
  html[data-v4-theme="system"] .v4-modal,
  html[data-v4-theme="system"] .v4-tour-card{background:rgba(249,252,254,.96);color:var(--v4-text)}
  html[data-v4-theme="system"] .card,
  html[data-v4-theme="system"] .my-day-section{background:var(--v4-surface);color:var(--v4-text)}
}

/* Business identity aura – remains based on the configured accent */
body[data-business-type="medical"]{--v4-business-glow:13%}
body[data-business-type="police"]{--v4-business-glow:15%}
body[data-business-type="law"]{--v4-business-glow:11%}
body[data-business-type="mechanic"]{--v4-business-glow:12%}
body[data-business-type="security"]{--v4-business-glow:14%}

/* Icons */
.v4-icon{display:inline-block;width:18px;height:18px;vertical-align:-3px;flex:none}
.side-nav .v4-icon{width:19px;height:19px}
.command-result-icon .v4-icon{width:19px;height:19px}
.notification-link .v4-icon,.sidebar-toggle .v4-icon,.sidebar-collapse-toggle .v4-icon{width:18px;height:18px}
.ui25-mini-btn .v4-icon{width:14px;height:14px}
.ui25-mobile-dock .v4-icon{width:20px;height:20px}
.ui25-quick-menu .v4-icon{width:18px;height:18px}
.ui25-quick-button .v4-icon{width:23px;height:23px}
.v4-icon-btn{display:grid!important;place-items:center!important;min-width:38px}
.v4-icon-btn .v4-icon{width:16px;height:16px}

/* App chrome */
.app-sidebar{
  border-right:1px solid var(--v4-line)!important;
  box-shadow:8px 0 40px rgba(0,0,0,.08);
}
.sidebar-brand{border-radius:15px}
.sidebar-brand:hover{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.side-nav{padding-top:6px}
.side-nav a{
  position:relative;border:1px solid transparent!important;border-radius:12px!important;margin:2px 8px!important;
}
.side-nav a:hover{background:var(--v4-surface-hover)!important;border-color:var(--v4-line)!important}
.side-nav a.active{
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 14%,transparent),color-mix(in srgb,var(--accent) 5%,transparent))!important;
  border-color:color-mix(in srgb,var(--accent) 23%,transparent)!important;
  color:var(--v4-text)!important;
}
.side-nav a.active:before{
  content:"";position:absolute;left:-9px;top:9px;bottom:9px;width:3px;border-radius:0 5px 5px 0;background:var(--accent);
  box-shadow:0 0 14px color-mix(in srgb,var(--accent) 45%,transparent);
}
.sidebar-tip{font-size:9px;letter-spacing:.02em}

.app-topbar{
  min-height:var(--v4-topbar-h);
  border-bottom:1px solid var(--v4-line)!important;
  backdrop-filter:blur(18px) saturate(130%);
  box-shadow:0 10px 34px rgba(0,0,0,.07);
}
.page-chip-label{letter-spacing:.13em}
.notification-link,
.command-trigger,
.sidebar-toggle,
.sidebar-collapse-toggle,
.v3-business-focus{
  border-color:var(--v4-line)!important;
  background:var(--v4-surface-soft)!important;
}
.notification-link:hover,.command-trigger:hover,.sidebar-toggle:hover,.sidebar-collapse-toggle:hover,.v3-business-focus:hover{
  background:color-mix(in srgb,var(--accent) 9%,var(--v4-surface-soft))!important;
  border-color:color-mix(in srgb,var(--accent) 28%,transparent)!important;
}
.v4-theme-button[data-theme-label]:after{
  content:attr(data-theme-label);position:absolute;top:calc(100% + 8px);right:0;white-space:nowrap;
  font-size:8px;padding:5px 7px;border:1px solid var(--v4-line);border-radius:8px;background:var(--v4-surface-solid);
  color:var(--v4-muted);opacity:0;pointer-events:none;transform:translateY(-3px);transition:.16s ease;
}
.v4-theme-button{position:relative}
.v4-theme-button:hover:after{opacity:1;transform:none}

/* General surfaces */
.card{
  border-color:var(--v4-line)!important;
  background:var(--v4-surface)!important;
  box-shadow:var(--v4-shadow-soft)!important;
  backdrop-filter:blur(12px);
}
.card:hover{border-color:var(--v4-line-strong)!important}
.page-head h1{letter-spacing:-.035em}
.page-head p,.muted{color:var(--v4-muted)!important}
.btn{
  border-radius:11px!important;
  transition:transform .14s var(--v4-ease),box-shadow .14s ease,background .14s ease,border-color .14s ease!important;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.985)}
.btn:not(.secondary):not(.danger){box-shadow:0 7px 18px color-mix(in srgb,var(--accent) 18%,transparent)}
input,select,textarea{
  border-radius:11px!important;
  transition:border-color .14s ease,box-shadow .14s ease,background .14s ease;
}
input:focus,select:focus,textarea:focus{
  border-color:color-mix(in srgb,var(--accent) 55%,transparent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 11%,transparent)!important;
}
.pill{border:1px solid var(--v4-line);backdrop-filter:blur(8px)}
details{border-radius:12px}

/* Context bar */
.ui25-contextbar{
  padding:6px 8px;border-radius:13px;border:1px solid transparent;
  transition:border-color .16s ease,background .16s ease;
}
.ui25-contextbar:hover{border-color:var(--v4-line);background:var(--v4-surface-soft)}
.ui25-mini-btn{text-decoration:none!important}
.ui25-mini-btn:hover{transform:translateY(-1px)}

/* Premium dashboard */
.v4-dashboard-hero{
  position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:center;
  min-height:160px;margin-bottom:16px;padding:24px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--v4-line));
  border-radius:22px;background:
    linear-gradient(110deg,color-mix(in srgb,var(--accent) 12%,var(--v4-surface)),var(--v4-surface) 58%);
  box-shadow:var(--v4-shadow);
}
.v4-dashboard-hero:before{
  content:"";position:absolute;width:320px;height:320px;right:-120px;top:-170px;border-radius:50%;
  background:color-mix(in srgb,var(--accent) 14%,transparent);filter:blur(3px);
}
.v4-dashboard-hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,var(--accent),transparent 68%);
}
.v4-hero-copy{position:relative;z-index:1;display:grid;gap:7px}
.v4-hero-kicker{font-size:9px;letter-spacing:.18em;color:var(--accent);font-weight:900}
.v4-hero-copy h1{margin:0;font-size:clamp(25px,3.2vw,40px);letter-spacing:-.045em}
.v4-hero-copy p{margin:0;color:var(--v4-muted);max-width:700px}
.v4-hero-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:4px}
.v4-hero-meta span{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid var(--v4-line);border-radius:999px;background:rgba(255,255,255,.025);font-size:9px}
.v4-hero-actions{position:relative;z-index:1;display:grid;gap:8px;min-width:180px}
.v4-hero-actions .btn{justify-content:center}
.v4-live-indicator{display:inline-flex;align-items:center;gap:6px}
.v4-live-indicator:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--v4-success);box-shadow:0 0 0 5px color-mix(in srgb,var(--v4-success) 10%,transparent)}

.my-day-section{
  border-color:var(--v4-line-strong)!important;
  background:linear-gradient(110deg,color-mix(in srgb,var(--accent) 7%,var(--v4-surface)),var(--v4-surface))!important;
  box-shadow:var(--v4-shadow-soft);
}
.my-day-card{
  position:relative;overflow:hidden;background:var(--v4-surface-soft)!important;border-color:var(--v4-line)!important;
}
.my-day-card:after{
  content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,var(--accent),transparent);opacity:.3
}
.my-day-card:hover{transform:translateY(-2px);box-shadow:0 9px 22px rgba(0,0,0,.13)}
.my-day-icon{color:var(--accent)!important}
.my-day-icon .v4-icon{width:19px;height:19px}
.my-day-card.v4-widget-hidden{display:none!important}
.my-day-grid.v4-customizing{outline:1px dashed color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:7px;border-radius:13px}
.my-day-grid.v4-customizing .my-day-card{cursor:grab}
.my-day-grid.v4-customizing .my-day-card:before{
  content:"⋮⋮";position:absolute;right:8px;top:5px;color:var(--v4-muted);font-size:11px;letter-spacing:-2px
}
.my-day-grid.v4-customizing .my-day-card.v4-dragging{opacity:.45;transform:scale(.98)}
.v4-dashboard-customizer{
  display:none;margin:10px 0 4px;padding:11px;border:1px solid var(--v4-line);border-radius:13px;background:var(--v4-surface-soft)
}
.v4-dashboard-customizer.open{display:block}
.v4-dashboard-customizer-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:9px}
.v4-dashboard-customizer-list{display:flex;gap:7px;flex-wrap:wrap}
.v4-dashboard-toggle{
  display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--v4-line);border-radius:9px;background:var(--v4-surface-soft);font-size:9px;cursor:pointer
}
.v4-dashboard-toggle input{width:auto}

/* Systemwide toast system */
.v4-js .v4-toast-source{display:none!important}
.v4-toast-stack{
  position:fixed;right:18px;top:82px;z-index:10050;width:min(390px,calc(100vw - 28px));
  display:grid;gap:9px;pointer-events:none
}
.v4-toast{
  --toast-color:var(--v4-info);
  display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;align-items:start;
  padding:11px 11px 11px 10px;border:1px solid color-mix(in srgb,var(--toast-color) 29%,var(--v4-line));
  border-radius:15px;background:color-mix(in srgb,var(--toast-color) 5%,var(--v4-surface-solid));
  color:var(--v4-text);box-shadow:0 20px 50px rgba(0,0,0,.28);backdrop-filter:blur(18px);
  pointer-events:auto;transform:translateX(22px);opacity:0;animation:v4-toast-in .24s var(--v4-ease) forwards;
}
.v4-toast.success{--toast-color:var(--v4-success)}
.v4-toast.warning{--toast-color:var(--v4-warning)}
.v4-toast.error{--toast-color:var(--v4-danger)}
.v4-toast.info{--toast-color:var(--v4-info)}
.v4-toast-icon{
  display:grid;place-items:center;width:36px;height:36px;border-radius:11px;
  color:var(--toast-color);background:color-mix(in srgb,var(--toast-color) 10%,transparent)
}
.v4-toast-icon .v4-icon{width:19px;height:19px}
.v4-toast-copy{display:grid;gap:3px;min-width:0}
.v4-toast-copy strong{font-size:11px}
.v4-toast-copy p{margin:0;color:var(--v4-muted);font-size:9px;line-height:1.45;overflow-wrap:anywhere}
.v4-toast-close{
  width:27px;height:27px;border:0;border-radius:8px;background:transparent;color:var(--v4-muted);cursor:pointer;padding:5px
}
.v4-toast-close:hover{background:var(--v4-surface-hover);color:var(--v4-text)}
.v4-toast-progress{grid-column:1/-1;height:2px;border-radius:2px;background:color-mix(in srgb,var(--toast-color) 65%,transparent);transform-origin:left;animation:v4-toast-progress var(--toast-duration,5000ms) linear forwards}
.v4-toast.leaving{animation:v4-toast-out .18s ease forwards}
@keyframes v4-toast-in{to{opacity:1;transform:none}}
@keyframes v4-toast-out{to{opacity:0;transform:translateX(18px)}}
@keyframes v4-toast-progress{to{transform:scaleX(0)}}

/* Global modal confirmation */
.v4-modal-backdrop{
  position:fixed;inset:0;z-index:10070;display:grid;place-items:center;padding:20px;
  background:rgba(2,8,14,.72);backdrop-filter:blur(11px)
}
.v4-modal-backdrop[hidden]{display:none}
.v4-modal{
  width:min(480px,100%);display:grid;grid-template-columns:54px 1fr;gap:13px;padding:18px;
  border:1px solid var(--v4-line-strong);border-radius:20px;background:rgba(7,20,32,.98);box-shadow:0 35px 100px rgba(0,0,0,.55);
  animation:v4-modal-in .18s var(--v4-ease)
}
.v4-modal-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;color:var(--v4-warning);background:color-mix(in srgb,var(--v4-warning) 9%,transparent)}
.v4-modal-icon.danger{color:var(--v4-danger);background:color-mix(in srgb,var(--v4-danger) 9%,transparent)}
.v4-modal-icon .v4-icon{width:25px;height:25px}
.v4-modal-copy{min-width:0}.v4-modal-kicker{font-size:8px;letter-spacing:.15em;color:var(--v4-muted);font-weight:900}
.v4-modal-copy h2{margin:4px 0 5px;font-size:18px}.v4-modal-copy p{margin:0;color:var(--v4-muted);line-height:1.55}
.v4-modal-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
@keyframes v4-modal-in{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}

/* Loading / navigation feedback */
.v4-loading-bar{position:fixed;left:0;right:0;top:0;height:3px;z-index:11000;pointer-events:none;opacity:0;transition:opacity .12s ease}
.v4-loading-bar.active{opacity:1}
.v4-loading-bar span{
  display:block;width:35%;height:100%;background:linear-gradient(90deg,transparent,var(--accent),transparent);
  animation:v4-loader 1s ease-in-out infinite
}
@keyframes v4-loader{from{transform:translateX(-100%)}to{transform:translateX(390%)}}
body.v4-submitting .app-main{cursor:progress}

/* Tables 2.0 */
.v4-table-shell{position:relative;margin:0 0 8px}
.v4-table-toolbar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 8px;padding:7px;
  border:1px solid var(--v4-line);border-radius:12px;background:var(--v4-surface-soft)
}
.v4-table-search{position:relative;flex:1;min-width:180px}
.v4-table-search .v4-icon{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--v4-muted)}
.v4-table-search input{width:100%;padding-left:30px!important;margin:0!important;min-height:34px!important;font-size:10px!important}
.v4-table-toolbar select{width:auto!important;min-width:74px;min-height:34px!important;margin:0!important;font-size:9px}
.v4-table-tool{
  display:inline-flex;align-items:center;gap:5px;min-height:34px;padding:0 9px;border:1px solid var(--v4-line);
  border-radius:9px;background:var(--v4-surface-soft);color:var(--v4-muted);cursor:pointer;font-size:9px
}
.v4-table-tool:hover{background:var(--v4-surface-hover);color:var(--v4-text)}
.v4-table-tool .v4-icon{width:13px;height:13px}
.v4-table-columns{position:relative}
.v4-table-columns-panel{
  position:absolute;right:0;top:calc(100% + 6px);z-index:60;width:220px;padding:8px;border:1px solid var(--v4-line);
  border-radius:12px;background:var(--v4-surface-solid);box-shadow:var(--v4-shadow)
}
.v4-table-columns-panel[hidden]{display:none}
.v4-table-columns-panel label{display:flex;align-items:center;gap:7px;padding:6px;border-radius:7px;font-size:9px;cursor:pointer}
.v4-table-columns-panel label:hover{background:var(--v4-surface-hover)}
.v4-table-columns-panel input{width:auto!important;margin:0!important}
.v4-table-info{margin-left:auto;color:var(--v4-muted);font-size:9px;white-space:nowrap}
.v4-table-pages{display:flex;gap:4px}
.v4-table-pages button{
  min-width:30px;height:30px;border:1px solid var(--v4-line);border-radius:8px;background:var(--v4-surface-soft);color:var(--v4-muted);cursor:pointer
}
.v4-table-pages button.active{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--v4-text);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.v4-sortable{cursor:pointer;user-select:none}
.v4-sortable:after{content:"↕";margin-left:5px;color:var(--v4-muted);font-size:8px}
.v4-sortable[data-sort="asc"]:after{content:"↑";color:var(--accent)}
.v4-sortable[data-sort="desc"]:after{content:"↓";color:var(--accent)}
.v4-table-empty-row td{text-align:center!important;color:var(--v4-muted)!important;padding:22px!important}
.v4-col-hidden{display:none!important}

/* Onboarding / tour */
.v4-tour-backdrop{position:fixed;inset:0;z-index:10090;background:rgba(1,6,11,.72);backdrop-filter:blur(3px)}
.v4-tour-backdrop[hidden]{display:none}
.v4-tour-spotlight{
  position:fixed;border:2px solid color-mix(in srgb,var(--accent) 75%,white);border-radius:15px;
  box-shadow:0 0 0 9999px rgba(1,6,11,.62),0 0 0 6px color-mix(in srgb,var(--accent) 9%,transparent),0 0 35px color-mix(in srgb,var(--accent) 18%,transparent);
  pointer-events:none;transition:.24s var(--v4-ease)
}
.v4-tour-card{
  position:fixed;z-index:2;width:min(380px,calc(100vw - 28px));padding:16px;border:1px solid var(--v4-line-strong);
  border-radius:18px;background:rgba(7,20,32,.98);box-shadow:0 28px 90px rgba(0,0,0,.48)
}
.v4-tour-progress{height:3px;background:var(--v4-surface-hover);border-radius:5px;overflow:hidden;margin-bottom:13px}
.v4-tour-progress span{display:block;height:100%;background:var(--accent);transition:width .2s ease}
.v4-tour-kicker{font-size:8px;letter-spacing:.15em;color:var(--accent);font-weight:900}
.v4-tour-card h2{margin:5px 0 5px}.v4-tour-card p{margin:0;color:var(--v4-muted);line-height:1.55}
.v4-tour-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}

/* Login 4.0 */
.v4-login-body{
  min-height:100vh;display:grid;place-items:center;padding:22px;
  background:
    radial-gradient(circle at 20% 15%,color-mix(in srgb,var(--accent,#58b8ff) 16%,transparent),transparent 30%),
    radial-gradient(circle at 85% 80%,color-mix(in srgb,var(--accent,#58b8ff) 8%,transparent),transparent 32%),
    var(--v4-bg);
}
.v4-login-shell{width:min(980px,100%);display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden;border:1px solid var(--v4-line-strong);border-radius:26px;background:rgba(7,20,32,.84);box-shadow:0 35px 100px rgba(0,0,0,.38);backdrop-filter:blur(20px)}
.v4-login-brand{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:560px;padding:34px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent,#58b8ff) 18%,transparent),rgba(255,255,255,.015))}
.v4-login-brand:after{content:"";position:absolute;width:360px;height:360px;border:1px solid color-mix(in srgb,var(--accent,#58b8ff) 18%,transparent);border-radius:50%;right:-150px;bottom:-130px;box-shadow:0 0 0 50px color-mix(in srgb,var(--accent,#58b8ff) 3%,transparent),0 0 0 100px color-mix(in srgb,var(--accent,#58b8ff) 2%,transparent)}
.v4-login-logo{position:relative;z-index:1;display:flex;align-items:center;gap:11px}
.v4-login-logo-mark{width:48px;height:48px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent,#58b8ff) 35%,transparent);border-radius:15px;background:color-mix(in srgb,var(--accent,#58b8ff) 10%,transparent);color:var(--accent,#58b8ff)}
.v4-login-logo-mark .v4-icon{width:25px;height:25px}
.v4-login-logo div{display:grid}.v4-login-logo strong{font-size:16px}.v4-login-logo small{color:var(--v4-muted);font-size:9px;letter-spacing:.07em}
.v4-login-message{position:relative;z-index:1;max-width:490px}.v4-login-message span{font-size:9px;color:var(--accent,#58b8ff);letter-spacing:.16em;font-weight:900}.v4-login-message h1{font-size:clamp(31px,5vw,52px);line-height:1.02;letter-spacing:-.055em;margin:8px 0 12px}.v4-login-message p{color:#9eb5c8;line-height:1.7}
.v4-login-features{position:relative;z-index:1;display:flex;gap:7px;flex-wrap:wrap}.v4-login-features span{padding:6px 8px;border:1px solid var(--v4-line);border-radius:999px;background:rgba(255,255,255,.025);font-size:8px;color:#a9bfd1}
.v4-login-form{display:flex;flex-direction:column;justify-content:center;padding:36px}
.v4-login-form-head{margin-bottom:20px}.v4-login-form-head span{font-size:9px;color:var(--accent,#58b8ff);letter-spacing:.13em;font-weight:900}.v4-login-form-head h2{margin:5px 0 5px;font-size:27px}.v4-login-form-head p{margin:0;color:var(--v4-muted)}
.v4-login-form .btn{width:100%;justify-content:center;min-height:43px;margin-top:7px}
.v4-login-security{display:flex;align-items:center;gap:7px;margin-top:15px;color:var(--v4-muted);font-size:9px}.v4-login-security .v4-icon{width:14px;height:14px}
.v4-login-footer{text-align:center;margin-top:18px;color:#61798e;font-size:8px}

/* UI QA page */
.v4-qa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.v4-qa-item{display:grid;grid-template-columns:34px 1fr;gap:9px;padding:11px;border:1px solid var(--v4-line);border-radius:13px;background:var(--v4-surface-soft)}
.v4-qa-item>span{width:32px;height:32px;display:grid;place-items:center;border-radius:9px}
.v4-qa-item.ok>span{color:var(--v4-success);background:color-mix(in srgb,var(--v4-success) 9%,transparent)}
.v4-qa-item.bad>span{color:var(--v4-danger);background:color-mix(in srgb,var(--v4-danger) 9%,transparent)}
.v4-qa-item div{display:grid;gap:2px}.v4-qa-item small{color:var(--v4-muted)}

/* Tiny polish */
::selection{background:color-mix(in srgb,var(--accent) 28%,transparent);color:var(--v4-text)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(132,162,187,.18);border:3px solid transparent;background-clip:padding-box;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(132,162,187,.28);border:3px solid transparent;background-clip:padding-box}
a{transition:color .14s ease,background .14s ease,border-color .14s ease,transform .14s ease}
.empty{border-radius:12px!important}
.v4-empty-illustration{display:inline-flex;margin-right:6px;color:var(--v4-muted)}
.v4-empty-illustration .v4-icon{width:15px;height:15px}

/* Responsive */
@media(max-width:1100px){
  .v4-dashboard-hero{grid-template-columns:1fr}.v4-hero-actions{grid-template-columns:repeat(2,1fr)}
  .v4-qa-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  :root{--v4-topbar-h:58px}
  .v4-toast-stack{top:68px;right:10px;width:calc(100vw - 20px)}
  .v4-dashboard-hero{padding:18px;min-height:auto}.v4-hero-actions{grid-template-columns:1fr 1fr}
  .v4-table-toolbar{position:sticky;left:0}.v4-table-info{order:10;width:100%;margin:0}
  .v4-tour-card{bottom:82px!important;left:14px!important;right:14px!important;top:auto!important;width:auto}
  .v4-login-shell{grid-template-columns:1fr}.v4-login-brand{display:none}.v4-login-form{padding:26px 22px}
  .v4-qa-grid{grid-template-columns:1fr}
}
@media(max-width:540px){
  .v4-hero-actions{grid-template-columns:1fr}
  .my-day-grid{grid-template-columns:1fr!important}
  .v4-modal{grid-template-columns:44px 1fr;padding:14px}.v4-modal-icon{width:42px;height:42px}
  .v4-table-tool span{display:none}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
