:root {
  color-scheme: dark;
  --bg: #08131d;
  --bg-deep: #050c13;
  --sidebar: #0a1621;
  --surface: #10212e;
  --surface-raised: #152a3a;
  --surface-soft: #0d1c28;
  --surface-input: #0a1924;
  --border: rgba(196, 216, 229, .14);
  --border-strong: rgba(196, 216, 229, .24);
  --text: #f2f7fa;
  --text-soft: #b5c5cf;
  --muted: #8198a7;
  --teal: #43d6c5;
  --teal-dark: #168d82;
  --cyan: #56c8f2;
  --gold: #e2b95f;
  --own-service: #d2a56d;
  --green: #60d394;
  --amber: #f5bf56;
  --red: #f17b7b;
  --purple: #b5a0f5;
  --shadow: 0 18px 50px rgba(0, 0, 0, .28);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, .16);
  --radius: 16px;
  --radius-sm: 10px;
  --sidebar-width: 224px;
  --content-max: 1180px;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body {
  min-height: 100%;
  margin: 0;
  overflow-x: clip;
  background:
    radial-gradient(circle at 82% -10%, rgba(67, 214, 197, .08), transparent 28rem),
    linear-gradient(145deg, var(--bg) 0%, var(--bg-deep) 100%);
  color: var(--text);
  font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}
body.modal-open { overflow: hidden; }
body.menu-lock { overflow: hidden; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.hidden { display: none !important; }
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; left: 16px; top: -70px; z-index: 200;
  padding: 10px 14px; border-radius: 8px; background: var(--teal); color: #05211f;
  font-weight: 800; transition: top .15s ease;
}
.skip-link:focus { top: 12px; }

/* Auth */
.auth-shell {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 15% 10%, rgba(86, 200, 242, .09), transparent 26rem),
    radial-gradient(circle at 85% 90%, rgba(67, 214, 197, .08), transparent 28rem);
}
.auth-card {
  width: min(440px, 100%);
  display: grid;
  gap: 26px;
  padding: clamp(28px, 5vw, 40px);
  border: 1px solid var(--border-strong);
  border-radius: 20px;
  background: #10212e;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}
.auth-card-small { width: min(520px, 100%); }
.auth-brand { display: flex; align-items: center; gap: 18px; }
.auth-brand.compact { align-items: flex-start; }
.auth-emblem { width: 76px; height: 90px; object-fit: contain; filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .36)); }
.auth-brand.compact .auth-emblem { width: 66px; height: 82px; }
.auth-brand-copy { display: grid; gap: 5px; min-width: 0; }
.auth-brand h1 { margin: 0; font-size: clamp(28px, 6vw, 36px); letter-spacing: .045em; line-height: 1; }
.auth-brand .auth-product { margin: 0; color: var(--teal); font-size: 15px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.auth-brand.compact h1 { margin: 3px 0 5px; font-size: clamp(25px, 6vw, 32px); letter-spacing: -.025em; }
.auth-brand p, .view-head p { margin: 0; color: var(--text-soft); line-height: 1.5; }
.auth-foot { margin: -8px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
.auth-version { margin: -18px 0 0; color: #6f8796; font-size: 10px; font-variant-numeric: tabular-nums; letter-spacing: .035em; text-align: center; }
.onboarding-preferences { display: grid; gap: 9px; padding-top: 16px; border-top: 1px solid var(--border); }
.onboarding-email-field { display: grid; gap: 7px; padding: 13px 14px; border: 1px solid var(--border); border-radius: 11px; background: rgba(7,20,29,.42); }
.onboarding-email-field .field-help { margin: 0; }
.onboarding-preferences-heading { display: grid; gap: 5px; margin-bottom: 2px; }
.onboarding-preferences-heading h2 { margin: 0; font-size: 18px; }
.onboarding-preferences-heading p, .onboarding-email-note { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.onboarding-preference { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; margin: 0; padding: 11px 12px; border: 1px solid var(--border); border-radius: 11px; background: rgba(7,20,29,.42); }
.onboarding-preference > div:first-of-type { min-width: 0; display: grid; gap: 3px; }
.onboarding-preference strong { color: var(--text-soft); font-size: 12px; line-height: 1.35; }
.onboarding-preference small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.onboarding-choice { display: grid; grid-template-columns: repeat(2,52px); gap: 4px; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: rgba(4,15,23,.58); }
.onboarding-choice label { position: relative; display: block; }
.onboarding-choice input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.onboarding-choice span { min-height: 34px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 6px; color: var(--muted); font-size: 11px; font-weight: 850; transition: border-color .15s ease,background .15s ease,color .15s ease; }
.onboarding-choice label:hover span { background: rgba(255,255,255,.035); color: var(--text-soft); }
.onboarding-choice label:has(input:checked) span { border-color: rgba(67,214,197,.28); background: rgba(67,214,197,.11); color: var(--teal); }
.onboarding-choice label:has(input:focus-visible) span { outline: 3px solid rgba(67,214,197,.24); outline-offset: 1px; }
.onboarding-email-note { padding: 1px 2px 0; }

/* Forms and controls */
.form-stack { display: grid; gap: 16px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.span-2 { grid-column: span 2; }
label { display: grid; gap: 7px; color: var(--text-soft); font-size: 12px; font-weight: 750; letter-spacing: .01em; }
input, select, textarea {
  width: 100%; min-width: 0;
  border: 1px solid var(--border-strong);
  border-radius: 9px;
  background: var(--surface-input);
  color: var(--text);
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
input, select { height: 44px; padding: 0 12px; }
textarea { min-height: 86px; padding: 11px 12px; resize: vertical; line-height: 1.45; }
input::placeholder, textarea::placeholder { color: #6f8796; }
input:focus, select:focus, textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(67, 214, 197, .13); background: #0c1d29; }
input[type="date"], input[type="month"] { color-scheme: dark; }
input[type="checkbox"] { width: 18px; height: 18px; padding: 0; accent-color: var(--teal); }
.check-field { display: flex; align-items: center; gap: 9px; min-height: 44px; }
.password-wrap { position: relative; display: block; }
.password-wrap input { height: 48px; padding-right: 54px; }
.password-wrap > .password-toggle {
  position: absolute; right: 2px; top: 50%;
  width: 44px; height: 44px; min-height: 44px;
  transform: translateY(-50%);
  border-color: transparent; border-radius: 8px; background: transparent;
}
.password-wrap > .password-toggle:hover { transform: translateY(-50%); border-color: transparent; background: rgba(255,255,255,.055); }
.login-options { display: flex; align-items: center; justify-content: space-between; gap: 8px 14px; flex-wrap: wrap; }
.remember-field { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; color: var(--text-soft); font-size: 12px; cursor: pointer; }
.remember-field input { flex: 0 0 auto; }
.auth-link { min-height: 44px; padding: 6px 0; border: 0; background: transparent; color: var(--teal); font-size: 12px; font-weight: 780; text-align: left; }
.auth-link:hover { color: #78ecdf; text-decoration: underline; text-underline-offset: 3px; }
.remember-note { margin: -14px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.field-help { margin: -4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.form-message { min-height: 18px; margin: -3px 0; font-size: 13px; font-weight: 650; }
.form-message:empty { visibility: hidden; }
.form-message.error { color: #ffaaaa; }
.form-message.success { color: #a7efc5; }
.compact-field { grid-template-columns: auto minmax(140px, 190px); align-items: center; gap: 10px; }
.search-field { min-width: min(320px, 100%); }
.search-field.small { min-width: min(260px, 100%); }

.button, .icon-button, .main-nav button, .segmented button, .manager-tabs button, .menu-action {
  border: 1px solid transparent;
  color: var(--text);
  transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
}
.button {
  min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 8px 15px; border-radius: 9px; background: var(--surface-raised); border-color: var(--border);
  font-weight: 800;
}
.button:hover { transform: translateY(-1px); border-color: var(--border-strong); background: #1a3344; }
.button:active { transform: translateY(0); }
.button.primary { background: linear-gradient(180deg, #3cccbc, #22a99b); border-color: rgba(91, 232, 216, .7); color: #041a19; box-shadow: 0 10px 24px rgba(34, 169, 155, .16); }
.button.primary:hover { background: linear-gradient(180deg, #56ddce, #29b6a8); }
.button.secondary { background: linear-gradient(180deg, #2a708e, #20576f); border-color: rgba(86, 200, 242, .35); }
.button.ghost { background: transparent; border-color: var(--border-strong); color: var(--text-soft); }
.button.text { min-height: 34px; padding: 4px 7px; border-color: transparent; background: transparent; color: var(--teal); }
.button.text:hover { background: rgba(67, 214, 197, .08); transform: none; }
.button.danger { background: rgba(241, 123, 123, .1); border-color: rgba(241, 123, 123, .26); color: #ffb5b5; }
.button.small { min-height: 34px; padding: 5px 10px; font-size: 12px; }
.wide { width: 100%; }
.icon-button {
  width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto;
  padding: 0; border-radius: 10px; border-color: var(--border); background: rgba(255, 255, 255, .025);
}
.icon-button:hover { border-color: var(--border-strong); background: rgba(255, 255, 255, .06); }
.ui-icon, .icon-button svg, .button svg, .nav-icon svg {
  width: 19px; height: 19px; display: block; flex: 0 0 auto;
  fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;
}
.ui-icon[aria-hidden="true"] { pointer-events: none; }
button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
button:disabled { cursor: not-allowed; opacity: .58; transform: none !important; }

/* App shell */
.app-layout { min-height: 100dvh; display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); }
.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 40;
  width: var(--sidebar-width); display: flex; flex-direction: column;
  padding: 22px 14px 18px;
  border-right: 1px solid var(--border);
  background: #0a1621;
}
.sidebar-header { display: flex; align-items: center; gap: 8px; padding: 0 2px 18px; border-bottom: 1px solid var(--border); }
.brand-lockup {
  min-width: 0; flex: 1 1 auto; display: flex; align-items: center; gap: 11px;
  min-height: 54px; padding: 0 8px; border: 1px solid transparent; border-radius: 10px;
  background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer;
}
.brand-lockup:hover { border-color: var(--border); background: rgba(255,255,255,.035); }
.brand-lockup:focus-visible { outline: 3px solid rgba(64,196,255,.34); outline-offset: 2px; }
.sidebar-close { display: none; flex: 0 0 auto; }
.sidebar-management-title { display: none; }
.brand-emblem { width: 38px; height: 44px; object-fit: contain; filter: drop-shadow(0 5px 9px rgba(0,0,0,.34)); }
.brand-lockup div { display: grid; line-height: 1.08; }
.brand-lockup strong { font-size: 17px; letter-spacing: .075em; }
.brand-lockup span { color: var(--muted); font-size: 10px; font-weight: 720; letter-spacing: .1em; text-transform: uppercase; }
.main-nav { min-height: 0; flex: 1 1 auto; display: grid; align-content: start; gap: 0; margin-top: 18px; overflow-y: auto; }
.nav-group { display: grid; gap: 4px; }
.nav-group.management { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.nav-section-label {
  margin: 0 11px 6px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.main-nav button {
  width: 100%; min-height: 42px; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 9px;
  padding: 8px 10px; border-radius: 8px; background: transparent; color: #92a7b4; font-size: 13px; font-weight: 700; text-align: left;
}
.main-nav button:hover { background: rgba(255, 255, 255, .045); color: var(--text); }
.main-nav button.active { background: rgba(67, 214, 197, .09); border-color: rgba(67, 214, 197, .16); color: #eafffc; box-shadow: inset 2px 0 var(--teal); }
.nav-icon { display: grid; place-items: center; color: currentColor; }
.nav-badge { min-width: 20px; height: 20px; display: grid; place-items: center; padding: 0 5px; border-radius: 99px; background: rgba(245, 191, 86, .14); color: #ffd98d; font-size: 10px; }
.sidebar-foot { display: flex; align-items: center; gap: 8px; margin-top: auto; padding: 15px 10px 0; border-top: 1px solid var(--border); color: var(--muted); font-size: 11px; font-weight: 650; }
.sidebar-foot-copy { min-width: 0; display: grid; gap: 2px; }
.sidebar-version { color: #667e8d; font-size: 9px; font-variant-numeric: tabular-nums; font-weight: 650; letter-spacing: .035em; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(96, 211, 148, .09); }
.app-stage { min-width: 0; grid-column: 2; }
.topbar {
  position: sticky; top: 0; z-index: 30;
  min-height: 58px; display: flex; align-items: center; gap: 12px;
  padding: 6px clamp(18px, 3.2vw, 36px);
  border-bottom: 1px solid var(--border);
  background: rgba(8, 19, 29, .86); backdrop-filter: blur(18px);
}
.menu-button { display: none; }
.page-identity { min-width: 0; margin-right: auto; }
.page-identity h1 { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 19px; line-height: 1.15; }
.eyebrow { color: var(--teal); font-size: 10px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.refresh-status {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 8px;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}
.refresh-indicator {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 3px rgba(96, 211, 148, .08);
}
.refresh-status.loading .refresh-indicator { background: var(--cyan); animation: sync-pulse 1.2s ease-in-out infinite; }
.refresh-status.error { color: #ffb5b5; }
.refresh-status.error .refresh-indicator { background: var(--red); box-shadow: 0 0 0 3px rgba(241, 123, 123, .09); }
.refresh-retry {
  min-height: 30px;
  padding: 3px 7px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--teal);
  font-size: 11px;
  font-weight: 800;
}
.refresh-retry:hover { background: rgba(67, 214, 197, .08); }
@keyframes sync-pulse { 50% { opacity: .35; } }
.user-menu { position: relative; }
.user-menu summary {
  width: min(196px, 24vw); height: 46px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 9px;
  padding: 5px 10px 5px 6px; border: 1px solid rgba(67,214,197,.16); border-radius: 12px;
  background: linear-gradient(135deg,rgba(67,214,197,.065),rgba(16,33,46,.96) 58%,rgba(86,200,242,.035));
  box-shadow: inset 0 1px rgba(255,255,255,.025); list-style: none; cursor: pointer;
  transition: border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.user-menu summary::-webkit-details-marker { display: none; }
.user-menu summary:hover, .user-menu[open] summary { border-color: rgba(67,214,197,.34); background: linear-gradient(135deg,rgba(67,214,197,.11),rgba(19,39,53,.98) 62%,rgba(86,200,242,.055)); box-shadow: inset 0 1px rgba(255,255,255,.04),0 8px 22px rgba(0,0,0,.12); }
.avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(67,214,197,.13); border: 1px solid rgba(67,214,197,.26); color: #dffefa; font-size: 11px; font-weight: 900; }
.avatar.large { width: 44px; height: 44px; font-size: 13px; }
.user-copy { display: grid; min-width: 0; }
.user-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.user-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 10px; }
.user-menu-panel { position: absolute; right: 0; top: 53px; width: 290px; display: grid; gap: 5px; padding: 11px; border: 1px solid var(--border-strong); border-radius: 14px; background: #10212e; box-shadow: var(--shadow); }
.menu-identity { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; align-items: center; padding: 8px 7px 13px; border-bottom: 1px solid var(--border); }
.menu-identity div { display: grid; min-width: 0; }
.menu-identity strong, .menu-identity small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.menu-identity small { color: var(--muted); font-size: 11px; }
.menu-action { min-height: 39px; padding: 8px 10px; border-radius: 8px; background: transparent; color: var(--text-soft); text-align: left; }
.menu-action:hover { background: rgba(255,255,255,.05); color: var(--text); }
.menu-action.danger { color: #ffaaaa; }
.content { width: min(var(--content-max), 100%); margin: 0 auto; padding: clamp(24px, 3vw, 36px); overflow-x: clip; }
.content:focus { outline: none; }
.view { display: none; animation: view-in .18s ease-out; }
.view.active { display: block; }
@keyframes view-in { from { opacity: 0; transform: translateY(5px); } }
.view-head { display: flex; align-items: flex-end; gap: 20px; margin-bottom: 22px; }
.view-head.split { justify-content: space-between; }
.view-head h2 { margin: 4px 0 7px; font-size: clamp(24px, 2.8vw, 32px); letter-spacing: -.025em; }
.view-head p { max-width: 680px; }

/* Panels and dashboard */
.dashboard-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.span-7 { grid-column: span 7; }
.span-5 { grid-column: span 5; }
.span-4 { grid-column: span 4; }
.span-8 { grid-column: span 8; }
.panel { min-width: 0; padding: clamp(17px, 2.2vw, 23px); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.panel-head h3 { margin: 3px 0 0; font-size: 18px; }
.section-gap { margin-top: 16px; }
.personal-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px 24px; width: min(1040px,100%); margin-bottom: 16px; }
.personal-heading h2 { order: -1; margin: 0; font-size: clamp(20px, 2.2vw, 25px); letter-spacing: -.02em; line-height: 1.2; }
.personal-date { margin: 0; color: var(--text-soft); font-size: 13px; }
.services-column { width: min(1040px, 100%); }
.services-overview { padding: 0 clamp(17px,2.2vw,23px); }
.services-panel-head { align-items: center; margin-bottom: 0; padding: 18px 0 13px; border-bottom: 1px solid var(--border); }
.services-panel-head h3 { margin: 0; font-size: 15px; letter-spacing: .01em; }
.personal-services-list { min-width: 0; }
.service-detail-list dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.service-detail-list dd { margin: 0; overflow-wrap: anywhere; color: var(--text-soft); font-size: 13px; }
.service-row { min-width: 0; display: grid; grid-template-columns: minmax(120px,155px) minmax(0,1fr) auto; align-items: center; gap: 12px 20px; min-height: 72px; padding: 13px 2px; border-bottom: 1px solid var(--border); }
.service-row:last-child { border-bottom: 0; }
.service-row-date { display: grid; justify-items: start; gap: 4px; color: var(--text-soft); font-size: 12px; font-weight: 720; line-height: 1.4; }
.next-service-chip { display: inline-flex; min-height: 19px; align-items: center; padding: 1px 7px; border: 1px solid rgba(67,214,197,.25); border-radius: 99px; background: rgba(67,214,197,.07); color: #a9f5eb; font-size: 8px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.service-row-main { min-width: 0; display: grid; gap: 4px; }
.service-row-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-row-main strong { font-size: 14px; }
.service-row-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.service-origin { width: max-content; max-width: 100%; display: inline-flex; align-items: center; min-height: 22px; padding: 2px 8px; border: 1px solid var(--border); border-radius: 99px; background: rgba(255,255,255,.025); color: var(--text-soft); font-size: 10px; font-weight: 760; }
.service-origin.recovery { border-color: rgba(96,211,148,.22); background: rgba(96,211,148,.07); color: #b9eccd; }
.service-origin.return { border-color: rgba(245,191,86,.22); background: rgba(245,191,86,.07); color: #f6d493; }
.service-origin.changed { border-color: rgba(181,160,245,.22); background: rgba(181,160,245,.07); color: #d8cbff; }
.service-origin.source-go { border-color: rgba(86,200,242,.24); background: rgba(86,200,242,.065); color: #b9e8f9; }
.service-origin.source-gs { border-color: rgba(226,185,95,.3); background: rgba(226,185,95,.08); color: #f1d28f; }
.service-action-note { align-self: center; color: var(--amber); font-size: 11px; font-weight: 720; }
.management-summary { width: min(900px, 100%); }
.management-action-list { display: grid; gap: 12px; }
.management-action-row { min-width: 0; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 13px; min-height: 72px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 8px 22px rgba(0,0,0,.1); }
.management-action-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; background: rgba(67,214,197,.08); color: var(--teal); }
.management-action-copy { min-width: 0; display: grid; gap: 3px; }
.management-action-copy strong { font-size: 13px; }
.management-action-copy small { color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.management-action-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; margin: 0; padding: 0; border: 0; }
.management-action-row.incident { grid-template-columns: 40px minmax(0,1fr); align-items: start; min-height: 0; padding: 16px; border-color: rgba(241,123,123,.2); background: linear-gradient(145deg,rgba(241,123,123,.035),rgba(16,33,46,.94)); box-shadow: inset 3px 0 0 rgba(241,123,123,.5), 0 8px 22px rgba(0,0,0,.12); }
.management-action-row.incident .management-action-icon { margin-top: 2px; background: rgba(241,123,123,.09); color: var(--red); }
.management-action-row.incident .management-action-actions { grid-column: 2; justify-content: flex-start; margin-top: 4px; padding-top: 12px; border-top: 1px solid rgba(196,216,229,.11); }
.management-incident-copy { gap: 8px; }
.management-incident-copy > * { min-width: 0; max-width: 100%; }
.management-incident-heading { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 8px 12px; }
.management-incident-heading > strong { font-size: 14px; line-height: 1.38; overflow-wrap: break-word; word-break: normal; }
.management-incident-heading .status-chip { justify-self: end; }
.management-incident-context { display: flex; flex-wrap: wrap; gap: 3px 10px; color: var(--text-soft); font-size: 12px; font-weight: 750; line-height: 1.45; }
.management-incident-context > span, .management-incident-reason > span > span { display: inline-flex; min-width: 0; align-items: baseline; overflow-wrap: break-word; word-break: normal; }
.management-incident-copy p { margin: 0; color: var(--text-soft); font-size: 12px; line-height: 1.5; overflow-wrap: break-word; word-break: normal; }
.management-incident-copy small strong { color: var(--text-soft); }
.management-incident-reason { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 5px; overflow-wrap: break-word; word-break: normal; }
.management-incident-reason > span { min-width: 0; display: flex; flex-wrap: wrap; gap: 3px 10px; }
.management-incident-recommendation { display: grid; gap: 3px; padding: 9px 11px; border-left: 2px solid var(--teal); border-radius: 0 7px 7px 0; background: rgba(67,214,197,.045); color: #a9c2cf !important; overflow-wrap: break-word; word-break: normal; }
.management-clear { width: fit-content; display: flex; align-items: center; gap: 11px; padding: 11px 14px; border: 1px solid rgba(96,211,148,.16); border-radius: 11px; color: var(--green); }
.management-clear > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: rgba(96,211,148,.09); }
.management-clear > div { display: grid; gap: 2px; }
.management-clear strong { color: var(--text); font-size: 13px; }
.management-clear small { color: var(--muted); font-size: 11px; }
.skeleton-list { display: grid; gap: 10px; }
.skeleton-list span { height: 62px; border-radius: 10px; background: linear-gradient(90deg, rgba(255,255,255,.035), rgba(255,255,255,.075), rgba(255,255,255,.035)); background-size: 220% 100%; animation: skeleton-shift 1.35s ease-in-out infinite; }
@keyframes skeleton-shift { to { background-position: -120% 0; } }
.duty-list, .change-list, .table-list { display: grid; gap: 10px; }
.day-chip, .status-chip, .company-chip, .count-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 99px; font-weight: 800; white-space: nowrap; }
.day-chip { min-width: 45px; padding: 5px 8px; background: rgba(67,214,197,.1); color: #a9f5eb; font-size: 11px; }
/* Lists */
.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.duty-card { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 17px; padding: 17px; border: 1px solid var(--border); border-radius: 13px; background: rgba(16,33,46,.74); }
.duty-card.mine { border-left: 3px solid var(--teal); }
#historyList .duty-card.completed { grid-template-columns: 58px minmax(0,1fr) auto; gap: 11px; padding: 11px 13px; }
#historyList .duty-card.completed .duty-date { min-height: 52px; padding: 5px; }
#historyList .duty-card.completed .duty-date strong { font-size: 19px; }
#historyList .duty-card.completed .duty-main { gap: 4px; }
#historyList .duty-card.completed .duty-main h3 { font-size: 14px; }
#historyList .duty-card.completed .status-chip.approved { display: none; }
#historyList .duty-card.completed .duty-actions .button { min-height: 38px; padding: 6px 10px; }
#historyList .completed-service-meta { align-items: center; gap: 6px 9px; }
#historyList .completed-service-kind {
  min-height: 21px; display: inline-flex; align-items: center; padding: 2px 7px;
  border: 1px solid rgba(196,216,229,.15); border-radius: 99px; font-size: 10px; font-weight: 850;
  letter-spacing: .035em; line-height: 1; text-transform: uppercase; white-space: nowrap;
}
#historyList .completed-service-kind.weekday { border-color: rgba(67,214,197,.25); background: rgba(67,214,197,.08); color: #9ce9df; }
#historyList .completed-service-kind.weekend { border-color: rgba(226,185,95,.28); background: rgba(226,185,95,.09); color: #f2d593; }
#historyList .completed-service-days { color: var(--text-soft); font-size: 11px; font-weight: 750; line-height: 1.35; }
.duty-date { display: grid; place-items: center; min-height: 63px; padding: 7px; border-radius: 10px; background: rgba(86,200,242,.08); text-align: center; }
.duty-date strong { font-size: 22px; line-height: 1; }
.duty-date span { color: var(--cyan); font-size: 10px; font-weight: 850; text-transform: uppercase; }
.duty-date small { color: var(--muted); font-size: 10px; }
.duty-main { display: grid; gap: 6px; min-width: 0; }
.duty-main h3 { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; }
.duty-meta { display: flex; flex-wrap: wrap; gap: 7px 14px; color: var(--text-soft); font-size: 12px; }
.duty-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.status-chip { min-height: 24px; padding: 3px 9px; border: 1px solid var(--border); color: var(--text-soft); font-size: 10px; text-transform: uppercase; letter-spacing: .035em; }
.status-chip.pending { border-color: rgba(245,191,86,.24); background: rgba(245,191,86,.09); color: #ffd98d; }
.status-chip.approved { border-color: rgba(96,211,148,.24); background: rgba(96,211,148,.09); color: #a9ecc5; }
.status-chip.rejected { border-color: rgba(241,123,123,.24); background: rgba(241,123,123,.09); color: #ffaaaa; }
.status-chip.changed { border-color: rgba(181,160,245,.24); background: rgba(181,160,245,.09); color: #d8cbff; }
.company-chip { min-height: 22px; padding: 3px 8px; background: rgba(86,200,242,.08); color: #a9e6fb; font-size: 10px; }
.change-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 15px; align-items: center; padding: 17px; border: 1px solid var(--border); border-radius: 13px; background: rgba(16,33,46,.74); }
.change-card.pending { border-left: 3px solid var(--amber); }
.change-card.approved { border-left: 3px solid var(--green); }
.change-card.rejected { border-left: 3px solid var(--red); }
.change-main { display: grid; gap: 9px; min-width: 0; }
.change-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.change-route { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-weight: 750; }
.change-route .arrow { color: var(--teal); }
.change-detail { color: var(--text-soft); font-size: 12px; line-height: 1.45; }
.change-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.panel:has(.empty-state) .panel-head { margin-bottom: 7px; }
.empty-state { display: grid; justify-items: start; align-content: center; gap: 5px; min-height: 40px; padding: 4px 2px; color: var(--muted); text-align: left; }
.empty-state .empty-icon { display: none; }
.empty-state strong { color: var(--text-soft); }
.empty-state small { max-width: 460px; line-height: 1.45; }

/* Calendar */
.schedule-view { --schedule-line: rgba(196,216,229,.11); --schedule-card: rgba(16,33,46,.82); }
.schedule-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.schedule-heading { min-width: 0; }
.schedule-heading h2 { margin: 5px 0 3px; font-size: clamp(25px, 3vw, 32px); letter-spacing: -.025em; }
.schedule-heading p { margin: 0; color: var(--text-soft); line-height: 1.45; }
.schedule-view-switcher { display: inline-flex; flex: 0 0 auto; gap: 3px; padding: 4px; border: 1px solid var(--border); border-radius: 11px; background: rgba(7,20,29,.7); }
.schedule-view-switcher button { min-height: 38px; padding: 7px 15px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; }
.schedule-view-switcher button.active { border-color: var(--border); background: var(--surface-raised); color: var(--text); box-shadow: var(--shadow-soft); }
.schedule-period-bar { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 14px; align-items: center; margin-bottom: 14px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: rgba(10,25,36,.58); }
.schedule-period-actions { display: flex; align-items: center; gap: 7px; }
.schedule-period-actions .button { min-width: 68px; }
.schedule-period { margin: 0; color: var(--text); font-size: 15px; font-weight: 820; text-align: right; }
.schedule-incidents { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 13px; }
.schedule-incident { min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border: 1px solid var(--border); border-radius: 999px; background: rgba(16,33,46,.68); color: var(--text-soft); font-size: 11px; }
.schedule-incident .ui-icon { width: 15px; height: 15px; }
.schedule-incident.warning { border-color: rgba(245,191,86,.24); color: #ffe0a1; }
.schedule-incident.danger { border-color: rgba(241,123,123,.28); color: #ffb0b0; }
.schedule-incident.active { box-shadow: 0 0 0 2px rgba(67,214,197,.18); border-color: var(--teal); }
.schedule-desktop { min-width: 0; transition: opacity .15s ease; }
.schedule-desktop.is-loading { opacity: .58; }
.schedule-pane { min-width: 0; }
.schedule-state { min-height: 170px; display: grid; place-items: center; align-content: center; gap: 8px; padding: 24px; color: var(--muted); text-align: center; }
.schedule-state strong { color: var(--text-soft); font-size: 15px; }
.schedule-state small { max-width: 460px; line-height: 1.45; }

.schedule-week-shell { overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; background: rgba(8,22,32,.68); scrollbar-color: var(--border-strong) transparent; }
.schedule-week-table { width: 100%; min-width: 1260px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.schedule-week-table th, .schedule-week-table td { border-right: 1px solid var(--schedule-line); border-bottom: 1px solid var(--schedule-line); vertical-align: top; }
.schedule-week-table tr:last-child > * { border-bottom: 0; }
.schedule-week-table tr > *:last-child { border-right: 0; }
.schedule-week-table thead th { position: sticky; top: 0; z-index: 3; height: 58px; padding: 9px; background: #091923; color: var(--muted); text-align: center; }
.schedule-week-table thead th:first-child { left: 0; z-index: 4; width: 150px; text-align: left; }
.schedule-week-table thead th span { display: block; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.schedule-week-table thead th strong { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-top: 2px; border-radius: 50%; color: var(--text-soft); font-size: 14px; }
.schedule-week-table thead th.weekend-start { background: #0a1a25; color: var(--text-soft); }
.schedule-week-table thead th.weekend { background: #0b1d28; color: var(--text-soft); }
.schedule-week-table thead th.today strong { background: var(--teal); color: #06211f; }
.schedule-week-table tbody > tr > th { position: sticky; left: 0; z-index: 2; width: 150px; padding: 12px; background: #0b202b; text-align: left; }
.schedule-week-table tbody > tr > th span { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; }
.schedule-week-table tbody > tr > th strong { display: block; margin-top: 4px; color: var(--text-soft); font-size: 12px; line-height: 1.35; }
.schedule-week-table td { min-height: 140px; padding: 7px; background: rgba(10,25,36,.24); }
.schedule-week-table td.weekend-start { background: rgba(129,152,167,.025); }
.schedule-week-table td.weekend { background: rgba(129,152,167,.055); }
.schedule-week-table td.today { background: rgba(67,214,197,.035); }
.schedule-cell-empty { min-height: 68px; display: grid; place-items: center; color: rgba(129,152,167,.38); }

.schedule-assignment { --person-accent: var(--cyan); --service-accent: var(--teal); position: relative; width: 100%; min-width: 0; display: grid; gap: 5px; margin-bottom: 7px; padding: 9px 9px 9px 12px; overflow: hidden; border: 1px solid rgba(196,216,229,.13); border-radius: 9px; background: var(--schedule-card); color: var(--text); text-align: left; box-shadow: 0 6px 16px rgba(0,0,0,.1); }
.schedule-assignment::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--service-accent); }
.schedule-assignment:hover { border-color: rgba(67,214,197,.34); background: rgba(22,45,59,.96); }
.schedule-assignment:focus-visible { border-color: var(--teal); outline: 3px solid rgba(67,214,197,.2); outline-offset: 1px; }
.schedule-assignment.mine { border-color: rgba(210,165,109,.52); }
.schedule-assignment.changed { border-color: rgba(181,160,245,.42); }
.schedule-assignment.pending { border-color: rgba(245,191,86,.26); }
.schedule-assignment.conflict { border-color: rgba(241,123,123,.46); box-shadow: inset 0 0 0 1px rgba(241,123,123,.08); }
.schedule-assignment.impact { border-color: rgba(181,160,245,.34); }
.schedule-assignment.operational-deduction { border-style: dashed; border-color: rgba(245,191,86,.45); }
.schedule-assignment.operational-situation { border-style: dashed; border-color: rgba(181,160,245,.42); }
.schedule-assignment.source-go { --person-accent: var(--cyan); }
.schedule-assignment.source-gs { --person-accent: var(--gold); background: rgba(47,38,22,.62); }
.schedule-assignment.mine { background: linear-gradient(135deg,rgba(210,165,109,.17),rgba(16,33,46,.94)); }
.schedule-assignment.mine:hover { background: linear-gradient(135deg,rgba(210,165,109,.24),rgba(22,45,59,.97)); }
.schedule-assignment.origin-recovery { --person-accent: var(--green); }
.schedule-assignment.origin-return { --person-accent: var(--amber); }
.schedule-assignment.origin-changed { --person-accent: var(--purple); }
.schedule-assignment-time { color: #cceffb; font-size: 10px; font-weight: 850; font-variant-numeric: tabular-nums; }
.schedule-person { min-width: 0; display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 7px; align-items: center; }
.schedule-avatar { width: 26px; height: 26px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--person-accent) 55%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--person-accent) 13%, transparent); color: var(--text); font-size: 8px; font-weight: 900; }
.schedule-person-copy { min-width: 0; display: grid; gap: 2px; }
.schedule-rank { width: max-content; max-width: 100%; padding: 1px 5px; border: 1px solid var(--border); border-radius: 4px; color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .045em; line-height: 1.35; text-transform: uppercase; }
.schedule-person-copy strong { display: block; overflow: visible; color: var(--text); font-size: 11px; line-height: 1.28; overflow-wrap: anywhere; }
.schedule-assignment-service { color: var(--text-soft); font-size: 10px; line-height: 1.35; }
.schedule-assignment-origin { color: var(--person-accent); font-size: 8px; font-weight: 850; letter-spacing: .025em; line-height: 1.3; }
.schedule-assignment-meta { display: grid; gap: 3px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.schedule-assignment-status { display: inline-flex; align-items: center; gap: 4px; color: var(--text-soft); }
.schedule-assignment-status .ui-icon { width: 12px; height: 12px; }
.person-accent-1 { --person-accent: #56c8f2; }
.person-accent-2 { --person-accent: #43d6c5; }
.person-accent-3 { --person-accent: #b5a0f5; }
.person-accent-4 { --person-accent: #e2b95f; }
.person-accent-5 { --person-accent: #8ec5ff; }
.person-accent-6 { --person-accent: #89d5ae; }
.schedule-assignment.service-type-1 { --service-accent: #43d6c5; }
.schedule-assignment.service-type-2 { --service-accent: #56c8f2; }
.schedule-assignment.service-type-3 { --service-accent: #e2b95f; }
.schedule-assignment.service-type-4 { --service-accent: #b5a0f5; }
.schedule-assignment.service-type-5 { --service-accent: #60d394; }

.calendar-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; background: rgba(8,22,32,.68); }
.calendar-grid { min-width: 1120px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-head { min-height: 38px; display: grid; place-items: center; border-right: 1px solid var(--schedule-line); border-bottom: 1px solid var(--border); color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.calendar-head.weekend-start { background: rgba(129,152,167,.025); color: var(--text-soft); }
.calendar-head.weekend { background: rgba(129,152,167,.055); color: var(--text-soft); }
.calendar-head:nth-child(7) { border-right: 0; }
.calendar-day { position: relative; min-height: 156px; padding: 8px; border-right: 1px solid var(--schedule-line); border-bottom: 1px solid var(--schedule-line); background: rgba(10,25,36,.24); }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day.weekend-start { background-color: rgba(129,152,167,.025); }
.calendar-day.weekend { background-color: rgba(129,152,167,.055); }
.calendar-day.off { background: rgba(4,12,18,.38); }
.calendar-day.off > :not(.calendar-day-number) { opacity: .55; }
.calendar-day.selected { z-index: 1; box-shadow: inset 0 0 0 2px rgba(86,200,242,.58); }
.calendar-day.has-conflict::after, .calendar-day.has-pending::after, .calendar-day.has-impact::after { content: ""; position: absolute; top: 9px; left: 9px; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.calendar-day.has-pending:not(.has-conflict)::after { background: var(--amber); }
.calendar-day.has-impact:not(.has-conflict):not(.has-pending)::after { background: var(--purple); }
.calendar-day-number { width: 28px; height: 28px; display: grid; place-items: center; margin: 0 0 6px auto; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--text-soft); font-size: 11px; font-weight: 850; }
.calendar-day-number:hover { border-color: var(--border-strong); background: rgba(255,255,255,.04); }
.calendar-day.today .calendar-day-number { background: var(--teal); color: #06211f; }
.calendar-day.off .calendar-day-number { color: rgba(129,152,167,.55); }
.schedule-assignment.compact { gap: 3px; margin-bottom: 5px; padding: 6px 6px 6px 9px; box-shadow: none; }
.schedule-assignment.compact .schedule-person { grid-template-columns: minmax(0,1fr); }
.schedule-assignment.compact .schedule-avatar, .schedule-assignment.compact .schedule-rank { display: none; }
.schedule-assignment.compact .schedule-person-copy strong { font-size: 9px; }
.schedule-assignment.compact .schedule-assignment-service { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-assignment.compact .schedule-assignment-origin { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.schedule-compact-state { min-width: 0; display: inline-flex; align-items: center; gap: 3px; color: var(--text-soft); font-size: 8px; line-height: 1.25; }
.schedule-compact-state .ui-icon { width: 10px; height: 10px; flex: 0 0 auto; }
.calendar-more { width: 100%; min-height: 28px; padding: 4px; border: 0; border-radius: 6px; background: transparent; color: var(--cyan); font-size: 9px; font-weight: 850; text-align: left; }
.calendar-more:hover { background: rgba(86,200,242,.08); }
.schedule-day-detail { display: grid; gap: 10px; margin-top: 12px; padding: 15px; border: 1px solid var(--border); border-radius: 12px; background: rgba(16,33,46,.7); }
.schedule-day-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.schedule-day-detail-head h3 { margin: 0; font-size: 15px; }
#scheduleDayDetailList { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 8px; }

.calendar-legend { display: flex; flex-wrap: wrap; gap: 8px 15px; margin: 12px 2px 0; color: var(--muted); font-size: 10px; }
.calendar-legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend-swatch, .legend-outline { width: 10px; height: 10px; border-radius: 3px; background: rgba(86,200,242,.18); }
.legend-swatch.service-type-1 { background: #43d6c5; }
.legend-swatch.service-type-2 { background: #56c8f2; }
.legend-swatch.service-type-3 { background: #e2b95f; }
.legend-swatch.service-type-4 { background: #b5a0f5; }
.legend-swatch.service-type-5 { background: #60d394; }
.legend-swatch.neutral { border-left: 3px solid var(--cyan); }
.legend-swatch.source-go { background: rgba(86,200,242,.25); border-left: 3px solid var(--cyan); }
.legend-swatch.source-gs { background: rgba(226,185,95,.22); border-left: 3px solid var(--gold); }
.legend-swatch.recovery { background: rgba(96,211,148,.2); border-left: 3px solid var(--green); }
.legend-swatch.return { background: rgba(245,191,86,.2); border-left: 3px solid var(--amber); }
.legend-swatch.changed { background: rgba(181,160,245,.2); border-left: 3px solid var(--purple); }
.legend-outline { border: 1px solid var(--border-strong); background: transparent; }
.legend-outline.mine { border-color: var(--own-service); background: rgba(210,165,109,.15); }
.legend-outline.changed { border-color: var(--purple); }
.legend-outline.pending { border-color: var(--amber); }
.legend-outline.impact { border-color: var(--purple); background: rgba(181,160,245,.08); }
.legend-outline.deduction { border-style: dashed; border-color: var(--amber); background: rgba(245,191,86,.08); }
.legend-outline.situation { border-style: dashed; border-color: var(--purple); background: rgba(181,160,245,.08); }
.legend-outline.conflict { border-color: var(--red); background: rgba(241,123,123,.08); }
.schedule-people-grid, .schedule-people-mobile { display: grid; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); gap: 12px; }
.schedule-person-card { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: rgba(10,25,36,.66); }
.schedule-person-card > header { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 13px; border-bottom: 1px solid var(--border); }
.schedule-person-card > header .schedule-avatar { width: 38px; height: 38px; }
.schedule-person-card > header > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.schedule-person-card > header strong { overflow-wrap: anywhere; font-size: 13px; }
.schedule-person-card > header small { color: var(--muted); font-size: 9px; }
.schedule-person-duties { display: grid; }
.schedule-person-duty { --duty-accent: var(--cyan); width: 100%; min-width: 0; display: grid; grid-template-columns: minmax(116px,.72fr) minmax(150px,1.2fr) auto; gap: 11px; align-items: center; padding: 11px 13px 11px 16px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); text-align: left; box-shadow: inset 3px 0 0 var(--duty-accent); }
.schedule-person-duty:last-child { border-bottom: 0; }
.schedule-person-duty:hover { background: rgba(255,255,255,.035); }
.schedule-person-duty.source-gs { --duty-accent: var(--gold); }
.schedule-person-duty.origin-recovery { --duty-accent: var(--green); }
.schedule-person-duty.origin-return { --duty-accent: var(--amber); }
.schedule-person-duty.origin-changed { --duty-accent: var(--purple); }
.schedule-person-duty.conflict { --duty-accent: var(--red); }
.schedule-person-duty time { color: var(--text-soft); font-size: 10px; font-weight: 780; }
.schedule-person-duty > span { min-width: 0; display: grid; gap: 2px; }
.schedule-person-duty > span strong { overflow-wrap: anywhere; font-size: 11px; }
.schedule-person-duty small { color: var(--muted); font-size: 9px; }
.schedule-duty-state { justify-items: end; color: var(--text-soft); font-size: 9px; }
.availability-chip { width: max-content; max-width: 100%; display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border: 1px solid var(--border); border-radius: 99px; font-size: 9px; font-weight: 850; line-height: 1.3; text-align: center; }
.availability-chip.available { border-color: rgba(96,211,148,.25); background: rgba(96,211,148,.07); color: #afe8c7; }
.availability-chip.unavailable { border-color: rgba(245,191,86,.25); background: rgba(245,191,86,.07); color: #f4d08c; }
.calendar-mobile { display: none; }
.own-service-change { display: grid; gap: 2px; margin-top: 3px; color: var(--text-soft); }
.own-service-change > strong { color: #d9cdfd; font-size: 11px; }
.own-service-change > small { color: var(--muted); font-size: 10px; }

/* Manager and table rows */
.manager-tabs { display: flex; gap: 3px; margin-bottom: 16px; padding: 4px; border: 1px solid var(--border); border-radius: 11px; background: rgba(10,25,36,.62); }
.manager-tabs button { min-height: 39px; padding: 7px 14px; border-radius: 8px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; }
.manager-tabs button.active { background: var(--surface-raised); color: var(--text); border-color: var(--border); }
.count-badge { min-width: 20px; height: 20px; margin-left: 5px; padding: 0 5px; background: rgba(245,191,86,.13); color: #ffd98d; font-size: 10px; }
.manager-pane { display: none; }
.manager-pane.active { display: block; }
.planner-toolbar { display: grid; gap: 13px; padding: 15px; border: 1px solid var(--border); border-radius: 13px; background: rgba(10,25,36,.58); }
.planner-toolbar-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.planner-toolbar-head h3 { margin: 3px 0 0; font-size: 17px; }
.segmented.compact button { min-height: 36px; }
.planner-filters { display: grid; grid-template-columns: minmax(190px,1.25fr) repeat(3,minmax(120px,.8fr)) auto; gap: 9px; align-items: end; }
.planner-filters label { gap: 5px; font-size: 10px; letter-spacing: .045em; text-transform: uppercase; }
.planner-filters input, .planner-filters select { height: 40px; font-size: 12px; letter-spacing: 0; text-transform: none; }
.planner-results { padding: 0; overflow: hidden; box-shadow: none; }
.appointment-list { display: grid; }
.appointment-group + .appointment-group { border-top: 1px solid var(--border-strong); }
.appointment-group > header { display: flex; justify-content: space-between; gap: 12px; padding: 11px 14px; background: rgba(7,20,29,.55); }
.appointment-group > header h4 { margin: 0; font-size: 12px; }
.appointment-group > header span { color: var(--muted); font-size: 10px; }
.appointment-row { --appointment-accent: var(--cyan); display: grid; grid-template-columns: minmax(125px,.72fr) minmax(170px,1.2fr) minmax(80px,.5fr) minmax(145px,.8fr) minmax(95px,.55fr) auto; gap: 12px; align-items: center; min-height: 66px; padding: 10px 13px 10px 16px; border-top: 1px solid var(--border); box-shadow: inset 3px 0 0 var(--appointment-accent); }
.appointment-row.source-gs { --appointment-accent: var(--gold); }
.appointment-row.origin-recovery { --appointment-accent: var(--green); }
.appointment-row.origin-return { --appointment-accent: var(--amber); }
.appointment-row.origin-changed { --appointment-accent: var(--purple); }
.appointment-row time, .appointment-main, .appointment-meta { min-width: 0; display: grid; gap: 2px; color: var(--text-soft); font-size: 11px; }
.appointment-row time strong, .appointment-main strong { overflow-wrap: anywhere; color: var(--text); font-size: 11px; }
.appointment-row small { color: var(--muted); font-size: 9px; }
.appointment-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.management-composer { border: 1px solid var(--border); border-radius: 13px; background: rgba(10,25,36,.48); }
.management-composer > summary { min-height: 48px; display: flex; align-items: center; padding: 10px 15px; color: var(--text-soft); font-size: 12px; font-weight: 850; cursor: pointer; }
.management-composer[open] > summary { border-bottom: 1px solid var(--border); }
.management-composer > .dashboard-grid, .management-composer > .panel { margin: 14px; }

.personnel-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin-bottom: 13px; }
.personnel-summary article { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 11px; background: rgba(16,33,46,.58); }
.personnel-summary span { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.personnel-summary strong { font-size: 21px; font-variant-numeric: tabular-nums; }
.personnel-filters { display: grid; grid-template-columns: minmax(220px,1.3fr) minmax(150px,.75fr) minmax(140px,.7fr) auto; gap: 9px; align-items: end; margin-bottom: 12px; }
.personnel-filters label { gap: 5px; font-size: 10px; letter-spacing: .045em; text-transform: uppercase; }
.personnel-filters input, .personnel-filters select { height: 40px; font-size: 12px; letter-spacing: 0; text-transform: none; }
.personnel-panel { padding: 0; overflow: hidden; box-shadow: none; }
.personnel-panel > .panel-head { margin: 0; padding: 15px 16px; border-bottom: 1px solid var(--border); }
.personnel-list-head { display: none; }
.personnel-list, .access-list { display: grid; }
.personnel-row { position: relative; display: grid; grid-template-columns: minmax(260px,1.15fr) minmax(240px,.85fr) auto; gap: 20px; align-items: center; min-height: 86px; padding: 14px 16px 14px 19px; border-bottom: 1px solid var(--border); }
.personnel-row::before { content: ""; position: absolute; inset: 14px auto 14px 0; width: 3px; border-radius: 0 99px 99px 0; background: var(--border-strong); }
.personnel-row.is-available::before { background: rgba(96,211,148,.62); }
.personnel-row.is-unavailable::before { background: rgba(245,191,86,.68); }
.personnel-row:last-child, .access-row:last-child { border-bottom: 0; }
.personnel-identity, .access-identity { min-width: 0; display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 12px; align-items: center; }
.personnel-identity > .schedule-avatar { width: 42px; height: 42px; font-size: 11px; }
.access-identity > .schedule-avatar { width: 38px; height: 38px; }
.personnel-identity-copy, .access-identity > span:last-child { min-width: 0; display: grid; gap: 4px; }
.personnel-identity-heading { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 5px 8px; }
.personnel-identity strong { overflow-wrap: anywhere; font-size: 14px; line-height: 1.35; }
.access-identity strong { overflow-wrap: anywhere; font-size: 12px; }
.personnel-identity small { color: var(--muted); font-size: 10px; }
.access-identity small { color: var(--muted); font-size: 9px; }
.personnel-operational-state, .access-meta { min-width: 0; display: grid; gap: 6px; color: var(--text-soft); font-size: 11px; }
.personnel-state-label, .access-meta > small { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }
.personnel-operational-copy { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.personnel-operational-copy > .availability-chip { flex: 0 0 auto; min-height: 26px; padding-inline: 9px; font-size: 10px; }
.personnel-operational-detail { min-width: 0; display: grid; flex: 1 1 150px; gap: 2px; }
.personnel-operational-detail > strong { color: var(--text-soft); font-size: 13px; line-height: 1.35; }
.personnel-operational-detail > span { color: var(--muted); font-size: 10px; line-height: 1.35; }
.personnel-actions, .access-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
#view-personnel .personnel-actions .button { min-height: 38px; }
#view-personnel .personnel-actions .button.secondary { border-color: rgba(67,214,197,.26); background: rgba(67,214,197,.075); color: #9ce9df; box-shadow: none; }
.compact-form-panel { max-width: 620px; box-shadow: none; }
.access-row { display: grid; grid-template-columns: minmax(220px,1.25fr) minmax(145px,.7fr) minmax(100px,.55fr) minmax(115px,.55fr) auto; gap: 13px; align-items: center; min-height: 76px; padding: 12px 15px; border-bottom: 1px solid var(--border); }
.roles-matrix { min-width: 0; }
.role-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.role-card { display: grid; align-content: start; gap: 11px; padding: 17px; border: 1px solid var(--border); border-radius: 13px; background: rgba(16,33,46,.68); }
.role-card header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.role-card header strong { color: var(--teal); font-size: 22px; font-variant-numeric: tabular-nums; }
.role-key { color: var(--text); font-size: 14px; font-weight: 850; }
.role-card p { margin: 0; color: var(--text-soft); font-size: 11px; line-height: 1.5; }
.role-card ul, .role-guidance ul { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.role-card li { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.role-card li .ui-icon { width: 14px; height: 14px; color: var(--green); }
.role-guidance li { position: relative; padding-left: 15px; color: var(--text-soft); font-size: 12px; line-height: 1.5; }
.role-guidance li::before { content: ""; position: absolute; left: 0; top: .62em; width: 5px; height: 5px; border-radius: 50%; background: var(--teal); }
.person-detail-section { display: grid; gap: 10px; margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--border); }
.person-detail-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.person-detail-section h3 { margin: 0; font-size: 13px; }
.person-situation-list, .person-deduction-list { display: grid; gap: 7px; }
.person-situation-list article, .person-deduction-list article { display: grid; gap: 3px; padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: rgba(7,20,29,.4); }
.person-situation-list strong, .person-deduction-list strong { font-size: 11px; }
.person-situation-list span, .person-deduction-list span, .person-situation-list small, .person-deduction-list small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.person-detail-section-head > div { display: grid; gap: 3px; }
.person-detail-section-head p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.person-detail-modal .person-detail-operational { grid-column: 1 / -1; }
.person-detail-modal .person-detail-operational dd { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 9px; }
.person-detail-modal .person-detail-operational dd strong { color: var(--text-soft); font-size: 12px; }
.person-detail-modal .person-detail-operational dd small { flex-basis: 100%; color: var(--muted); font-size: 9px; }
.person-deduction-groups { display: grid; gap: 12px; }
.person-deduction-group { display: grid; gap: 8px; }
.person-deduction-group > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.person-deduction-group h4 { margin: 0; color: var(--text-soft); font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.person-deduction-group.active { padding: 10px; border: 1px solid rgba(72,211,203,.22); border-radius: 10px; background: rgba(72,211,203,.035); }
.person-deduction-group.upcoming { padding: 10px; border: 1px solid rgba(245,191,86,.2); border-radius: 10px; background: rgba(245,191,86,.03); }
.person-deduction-item { gap: 8px !important; padding: 12px !important; }
.person-deduction-item.current { border-color: rgba(72,211,203,.27); box-shadow: inset 3px 0 0 rgba(72,211,203,.65); }
.person-deduction-item.upcoming { border-color: rgba(245,191,86,.24); box-shadow: inset 3px 0 0 rgba(245,191,86,.58); }
.person-deduction-main { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 5px 8px; align-items: center; }
.person-deduction-main .status-chip { justify-self: start; font-size: 8px; }
.person-deduction-main strong { min-width: 0; font-size: 12px; }
.person-deduction-main time { grid-column: 2; color: var(--text-soft); font-size: 10px; }
.person-deduction-item > p { margin: 0; color: var(--text); font-size: 10px; line-height: 1.5; }
.person-deduction-meta { display: grid; gap: 3px; }
.person-deduction-meta span, .person-deduction-meta small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.person-deduction-actions { display: flex; flex-wrap: wrap; gap: 7px; padding-top: 2px; }
.person-deduction-actions .button { min-height: 44px; }
.person-situation-editor { margin-top: 16px; border: 1px solid var(--border); border-radius: 10px; }
.person-situation-editor > summary { min-height: 44px; display: flex; align-items: center; padding: 9px 12px; color: var(--text-soft); font-size: 11px; font-weight: 850; cursor: pointer; }
.person-situation-editor form { padding: 12px; border-top: 1px solid var(--border); }
.table-row { display: grid; grid-template-columns: minmax(180px, 1.5fr) repeat(2, minmax(110px, .8fr)) auto; gap: 12px; align-items: center; min-height: 62px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 10px; background: rgba(6,18,27,.3); }
.table-row.roster-row { grid-template-columns: minmax(180px, 1.4fr) minmax(90px,.6fr) minmax(105px,.7fr) minmax(110px,.7fr) auto; }
.table-row.user-row { grid-template-columns: minmax(170px,1.1fr) minmax(115px,.75fr) minmax(120px,.8fr) minmax(90px,.6fr); }
.table-primary { display: grid; min-width: 0; gap: 2px; }
.table-primary strong, .table-primary small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.table-primary small, .table-cell small { color: var(--muted); font-size: 10px; }
.table-cell { display: grid; gap: 2px; color: var(--text-soft); font-size: 12px; }
.table-actions { display: flex; justify-content: flex-end; gap: 6px; }
.user-filter-note { margin: -5px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.table-row.user-row .user-actions { grid-column: 1 / -1; justify-content: flex-end; padding-top: 9px; border-top: 1px solid var(--border); }
.user-actions { flex-wrap: wrap; align-items: stretch; }
.user-action-button { min-width: 112px; white-space: nowrap; }
.roster-actions { flex-wrap: wrap; align-items: stretch; }
.roster-action-button { white-space: nowrap; }
.recovery-list { display: grid; gap: 9px; }
.recovery-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--border); border-radius: 10px; background: rgba(6,18,27,.3); }
.recovery-copy { min-width: 0; display: grid; gap: 3px; }
.recovery-copy strong, .recovery-copy small { overflow-wrap: anywhere; }
.recovery-copy small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.recovery-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.segmented { display: inline-flex; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: rgba(10,25,36,.6); }
.segmented button { min-height: 34px; padding: 5px 12px; border-radius: 7px; background: transparent; color: var(--muted); font-size: 11px; font-weight: 800; }
.segmented button.active { background: var(--surface-raised); color: var(--text); }
.change-requested { margin-left: auto; color: var(--muted); font-size: 10px; font-weight: 650; }

/* Imports */
.import-source-section { display: grid; gap: 0; padding: 16px 0 22px; border-top: 1px solid var(--border); }
.import-source-section:first-of-type { padding-top: 0; border-top: 0; }
.import-source-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.import-source-heading > div { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 2px 10px; align-items: center; }
.import-source-heading h3 { margin: 0; font-size: 17px; }
.import-source-heading p { grid-column: 2; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.source-badge { min-width: 38px; min-height: 28px; display: inline-grid; place-items: center; grid-row: span 2; padding: 3px 8px; border: 1px solid var(--border); border-radius: 7px; font-size: 10px; font-weight: 900; letter-spacing: .06em; }
.source-badge.source-go { border-color: rgba(86,200,242,.28); background: rgba(86,200,242,.08); color: #b8e8f9; }
.source-badge.source-gs { border-color: rgba(226,185,95,.3); background: rgba(226,185,95,.08); color: #f2d493; }
.import-preview-details:empty { display: none; }
.go-preview-table { min-width: 580px; }
.import-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr); gap: 16px; align-items: start; }
.import-setup, .import-status-panel, .import-preview, .import-result { box-shadow: none; }
.gs-file-field { position: relative; min-height: 94px; align-content: center; justify-items: center; gap: 5px; padding: 16px; border: 1px dashed var(--border-strong); border-radius: 11px; background: rgba(7,20,29,.46); cursor: pointer; text-align: center; }
.gs-file-field:hover, .gs-file-field:focus-within { border-color: rgba(67,214,197,.48); background: rgba(67,214,197,.045); }
.gs-file-title { color: var(--text); font-size: 13px; }
.gs-file-name { max-width: 100%; overflow: hidden; color: var(--muted); font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.gs-file-field input { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); }
.import-status-panel { min-height: 100%; }
.import-last { display: grid; gap: 5px; padding: 2px 0 15px; border-bottom: 1px solid var(--border); }
.import-last > span { color: var(--teal); font-size: 12px; font-weight: 780; }
.import-last time, .import-last small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.import-recent { display: grid; gap: 8px; padding-top: 14px; }
.import-recent h4 { margin: 0 0 2px; color: var(--text-soft); font-size: 11px; }
.import-recent > div { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 9px; }
.import-recent span, .import-recent small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.import-recent small { color: var(--muted); }
.import-preview-head { align-items: flex-start; }
.import-preview-meta { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.import-summary { display: grid; grid-template-columns: repeat(auto-fit,minmax(120px,1fr)); gap: 8px; margin-bottom: 18px; }
.import-summary-item { min-width: 0; display: grid; gap: 3px; padding: 12px; border: 1px solid var(--border); border-radius: 9px; background: rgba(7,20,29,.4); }
.import-summary-item strong { font-size: 20px; font-variant-numeric: tabular-nums; }
.import-summary-item span { color: var(--muted); font-size: 10px; }
.import-summary-item.valid strong, .import-summary-item.create strong { color: var(--green); }
.import-summary-item.error strong { color: var(--red); }
.import-summary-item.update strong { color: var(--cyan); }
.import-block { display: grid; gap: 10px; margin-top: 18px; }
.import-block-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.import-block-head h4 { margin: 0; font-size: 13px; }
.import-table-shell { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.import-table { width: 100%; min-width: 760px; border-collapse: collapse; }
.import-table th { padding: 9px 10px; border-bottom: 1px solid var(--border-strong); background: rgba(7,20,29,.72); color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .045em; text-align: left; text-transform: uppercase; }
.import-table td { padding: 10px; border-bottom: 1px solid var(--border); color: var(--text-soft); font-size: 11px; line-height: 1.4; vertical-align: top; }
.import-table tbody tr:last-child td { border-bottom: 0; }
.import-action { display: inline-flex; padding: 2px 6px; border-radius: 99px; background: rgba(86,200,242,.08); color: #a9e6fb; font-size: 9px; font-weight: 800; white-space: nowrap; }
.import-action.create { background: rgba(96,211,148,.08); color: #a9ecc5; }
.import-action.update { background: rgba(86,200,242,.08); color: #a9e6fb; }
.import-action.remove { background: rgba(241,123,123,.08); color: #ffaaaa; }
.import-confirm { display: grid; justify-items: start; gap: 8px; margin-top: 20px; padding-top: 17px; border-top: 1px solid var(--border); }
.import-result-counts { display: flex; flex-wrap: wrap; gap: 7px; }
.import-result-counts span { padding: 7px 9px; border: 1px solid var(--border); border-radius: 8px; color: var(--text-soft); font-size: 11px; }
.recalculation-result { display: grid; gap: 4px; margin-top: 14px; padding: 13px; border: 1px solid rgba(96,211,148,.2); border-radius: 10px; background: rgba(96,211,148,.045); }
.recalculation-result strong { color: #a9ecc5; font-size: 13px; }
.recalculation-result span, .import-completed { color: var(--muted); font-size: 11px; line-height: 1.45; }
.import-warnings { margin: 13px 0 0; padding-left: 20px; color: #ffe3a6; font-size: 11px; line-height: 1.5; }
.import-completed { display: block; margin-top: 12px; }

/* Audit */
.audit-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.audit-summary-card { min-width: 0; display: grid; gap: 4px; padding: 15px 16px; border: 1px solid var(--border); border-radius: 12px; background: rgba(16,33,46,.68); }
.audit-summary-card span { color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.audit-summary-card strong { overflow: hidden; color: var(--text); font-size: clamp(19px, 2vw, 25px); font-variant-numeric: tabular-nums; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.audit-summary-card small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.audit-filter-panel { padding-bottom: 17px; }
.audit-filter-form { display: grid; gap: 12px; }
.audit-filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 12px; }
.audit-text-filter { grid-column: span 2; }
.audit-filter-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.audit-results-head { align-items: flex-start; }
.panel-meta { margin: 5px 0 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.audit-page-size { min-width: 116px; }
.audit-page-size select { height: 38px; }
.audit-results { min-height: 84px; }
.audit-table-shell { overflow-x: auto; border: 1px solid var(--border); border-radius: 11px; }
.audit-table { width: 100%; min-width: 780px; border-collapse: collapse; table-layout: fixed; }
.audit-table th { padding: 10px 12px; border-bottom: 1px solid var(--border-strong); background: rgba(7,20,29,.74); color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .055em; text-align: left; text-transform: uppercase; }
.audit-table th:nth-child(1) { width: 150px; }
.audit-table th:nth-child(2) { width: 170px; }
.audit-table th:nth-child(3) { width: 185px; }
.audit-table th:nth-child(4) { width: 165px; }
.audit-table th:last-child { width: 92px; text-align: right; }
.audit-table td { min-width: 0; padding: 12px; border-bottom: 1px solid var(--border); color: var(--text-soft); font-size: 12px; line-height: 1.4; vertical-align: middle; }
.audit-table tbody tr:last-child td { border-bottom: 0; }
.audit-table tbody tr:hover { background: rgba(67,214,197,.035); }
.audit-cell-primary { display: grid; gap: 2px; min-width: 0; }
.audit-cell-primary strong, .audit-cell-primary span, .audit-cell-primary small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audit-cell-primary small { color: var(--muted); font-size: 10px; }
.audit-action-value { color: #c6f8f1; }
.audit-detail-preview { color: var(--muted); }
.audit-row-action { text-align: right; }
.audit-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 11px; margin-top: 14px; }
.audit-pagination > span { min-width: 116px; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; text-align: center; }
.audit-state { min-height: 96px; display: grid; justify-items: start; align-content: center; gap: 8px; padding: 14px 2px; }
.audit-state strong { color: var(--text-soft); }
.audit-state small { max-width: 520px; color: var(--muted); line-height: 1.45; }
.audit-loading { min-height: 112px; }
.modal-wide { width: min(720px, 100%); }
.audit-detail-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin: 20px 0; }
.audit-detail-meta div { min-width: 0; display: grid; gap: 4px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 9px; background: rgba(6,18,27,.28); }
.audit-detail-meta dt, .audit-detail-list dt { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }
.audit-detail-meta dd, .audit-detail-list dd { min-width: 0; margin: 0; color: var(--text-soft); overflow-wrap: anywhere; }
.audit-detail-section { margin: 4px 0 18px; }
.audit-detail-section h3 { margin: 0 0 10px; font-size: 15px; }
.audit-detail-data { display: grid; gap: 7px; }
.audit-detail-list { display: grid; gap: 7px; margin: 0; }
.audit-detail-list > div { display: grid; grid-template-columns: minmax(115px, .42fr) minmax(0, 1fr); gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: rgba(6,18,27,.24); }
.audit-detail-list dd { white-space: pre-wrap; }

/* Modal and toast */
.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 18px; background: rgba(1,7,11,.76); backdrop-filter: blur(8px); }
.modal { width: min(560px, 100%); max-height: calc(100dvh - 36px); overflow-y: auto; padding: 24px; border: 1px solid var(--border-strong); border-radius: 18px; background: #10212e; box-shadow: 0 28px 80px rgba(0,0,0,.44); animation: modal-in .16s ease-out; }
.modal-small { width: min(500px, 100%); }
@keyframes modal-in { from { opacity: 0; transform: translateY(8px) scale(.99); } }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.modal-head h2 { margin: 3px 0 0; font-size: 23px; }
.modal-intro { margin: 0; color: var(--text-soft); font-size: 13px; line-height: 1.5; }
.impact-resolution-modal { width: min(720px, 100%); }
.impact-resolution-context { display: grid; gap: 10px; margin: 18px 0; padding: 15px; border: 1px solid rgba(241,123,123,.22); border-radius: 12px; background: rgba(241,123,123,.045); }
.impact-resolution-context.loading { min-height: 112px; place-items: center; color: var(--muted); }
.impact-resolution-context-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
.impact-resolution-context-head strong { font-size: 15px; line-height: 1.35; }
.impact-resolution-context p { margin: 0; color: var(--text-soft); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.impact-resolution-context-meta { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.impact-resolution-context-meta > span { display: grid; gap: 2px; min-width: 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: rgba(6,18,27,.3); }
.impact-resolution-context-meta small { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.impact-resolution-context-meta strong { color: var(--text-soft); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.impact-resolution-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.impact-resolution-fieldset > legend { margin-bottom: 10px; color: var(--text); font-size: 13px; font-weight: 850; }
.impact-resolution-options { display: grid; gap: 9px; }
#impactResolutionOptionHelp { margin: 12px 0 0; }
.impact-resolution-option { position: relative; display: grid; grid-template-columns: 20px minmax(0,1fr); gap: 10px; align-items: start; min-width: 0; padding: 13px; border: 1px solid var(--border); border-radius: 11px; background: rgba(6,18,27,.28); cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.impact-resolution-option:hover { border-color: var(--border-strong); background: rgba(255,255,255,.03); }
.impact-resolution-option.selected { border-color: rgba(67,214,197,.5); background: rgba(67,214,197,.065); box-shadow: inset 3px 0 0 var(--teal); }
.impact-resolution-option.disabled { opacity: .58; cursor: not-allowed; }
.impact-resolution-option input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--teal); }
.impact-resolution-option-copy { min-width: 0; display: grid; gap: 4px; }
.impact-resolution-option-copy strong { font-size: 13px; line-height: 1.35; }
.impact-resolution-option-copy span { color: var(--text-soft); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.impact-resolution-option-copy small { color: var(--muted); font-size: 10px; line-height: 1.4; overflow-wrap: anywhere; }
.impact-resolution-option-tag { width: fit-content; margin-top: 2px; padding: 2px 7px; border: 1px solid rgba(245,191,86,.2); border-radius: 99px; background: rgba(245,191,86,.065); color: #f6d493 !important; font-size: 8px !important; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.impact-resolution-consequence { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 9px; padding: 12px 13px; border: 1px solid rgba(245,191,86,.23); border-radius: 10px; background: rgba(245,191,86,.055); color: #f6d493; }
.impact-resolution-consequence .ui-icon { width: 19px; height: 19px; margin-top: 1px; }
.impact-resolution-consequence div { display: grid; gap: 3px; }
.impact-resolution-consequence strong { color: var(--text); font-size: 12px; }
.impact-resolution-consequence span { color: var(--text-soft); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.impact-resolution-confirm { display: grid !important; grid-template-columns: 20px minmax(0,1fr); gap: 9px !important; align-items: start; padding: 11px 12px; border: 1px solid var(--border); border-radius: 9px; background: rgba(255,255,255,.02); color: var(--text-soft) !important; font-size: 11px !important; font-weight: 650 !important; line-height: 1.45; cursor: pointer; }
.impact-resolution-confirm input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--teal); }
.impact-resolution-fieldset[disabled], .impact-resolution-confirm:has(input:disabled) { opacity: .62; }
.service-detail-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin: 20px 0; }
.service-detail-list div { display: grid; gap: 4px; min-width: 0; }
.service-detail-list dt { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.service-detail-list dd { margin: 0; color: var(--text-soft); line-height: 1.4; overflow-wrap: anywhere; }
.service-detail-backdrop { place-items: stretch end; padding: 0; background: rgba(1,7,11,.68); }
.service-detail-modal { width: min(500px, 100%); max-height: 100dvh; height: 100dvh; padding: 25px; border-width: 0 0 0 1px; border-radius: 0; animation: drawer-in .18s ease-out; }
@keyframes drawer-in { from { opacity: .7; transform: translateX(18px); } }
.service-detail-person { --person-accent: var(--cyan); display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 11px; align-items: center; margin-top: 18px; padding: 13px; border: 1px solid var(--border); border-radius: 11px; background: rgba(7,20,29,.52); }
.service-detail-person .schedule-avatar { width: 42px; height: 42px; font-size: 11px; }
.service-detail-person > span:last-child { min-width: 0; display: grid; gap: 4px; }
.service-detail-person strong { color: var(--text); font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
.service-detail-person small { color: var(--muted); font-size: 10px; }
.service-detail-change { display: grid; gap: 8px; margin: 0 0 16px; padding: 13px; border: 1px solid rgba(245,191,86,.2); border-radius: 10px; background: rgba(245,191,86,.045); }
.service-detail-change h3, .service-detail-change p { margin: 0; }
.service-detail-change h3 { font-size: 13px; }
.service-detail-change-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.service-detail-change-head small, .service-detail-change #serviceDetailChangeContent > small { display: block; color: var(--muted); font-size: 10px; line-height: 1.4; }
.service-detail-alerts { display: grid; gap: 8px; margin-bottom: 16px; }
.service-detail-alerts > div { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 8px; align-items: start; padding: 10px; border: 1px solid rgba(241,123,123,.18); border-radius: 9px; background: rgba(241,123,123,.045); color: var(--text-soft); font-size: 11px; line-height: 1.45; }
.service-detail-alerts .ui-icon { width: 16px; height: 16px; color: var(--red); }
.service-detail-notes { margin: 0 0 18px; padding: 12px 14px; border-left: 2px solid rgba(67,214,197,.35); background: rgba(67,214,197,.045); color: var(--text-soft); font-size: 12px; line-height: 1.5; }
.temporary-password { display: block; margin: 18px 0; padding: 16px; border: 1px solid rgba(67,214,197,.25); border-radius: 11px; background: rgba(4,16,24,.72); color: #c8fff8; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: clamp(17px, 4vw, 22px); font-weight: 800; letter-spacing: .04em; overflow-wrap: anywhere; text-align: center; }
.selected-summary { display: grid; gap: 3px; margin-bottom: 18px; padding: 14px; border: 1px solid rgba(67,214,197,.17); border-radius: 11px; background: rgba(67,214,197,.06); }
.selected-summary small { color: var(--muted); }
.deduction-result { display: grid; gap: 12px; padding: 15px; border: 1px solid rgba(67,214,197,.25); border-radius: 11px; background: rgba(67,214,197,.06); }
.deduction-result h3, .deduction-result h4, .deduction-result p { margin: 0; }
.deduction-result h3 { color: #c8fff8; font-size: 17px; }
.deduction-result h4 { margin-bottom: 7px; color: var(--text-soft); font-size: 12px; }
.deduction-result ul { display: grid; gap: 6px; margin: 0; padding-left: 20px; color: #ffe3a6; font-size: 12px; line-height: 1.45; }
.deduction-no-warnings { color: var(--muted); font-size: 12px; }
.deduction-cancel-panel { margin-top: 6px; border: 1px solid rgba(241,123,123,.22); border-radius: 11px; background: rgba(241,123,123,.035); }
.deduction-cancel-panel > summary { min-height: 44px; display: flex; align-items: center; padding: 10px 13px; color: #ffb5b5; font-size: 12px; font-weight: 850; cursor: pointer; }
.deduction-cancel-panel[open] { display: grid; gap: 11px; padding-bottom: 13px; }
.deduction-cancel-panel[open] > summary { border-bottom: 1px solid rgba(241,123,123,.14); }
.deduction-cancel-panel > p, .deduction-cancel-panel > label, .deduction-cancel-panel > button { margin-right: 13px; margin-left: 13px; }
.deduction-cancel-panel > p { margin-top: 0; margin-bottom: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.deduction-cancel-panel > button { justify-self: start; }
.modal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 3px; }
.toast-region { position: fixed; right: 18px; bottom: 18px; z-index: 140; width: min(380px, calc(100vw - 36px)); display: grid; gap: 8px; pointer-events: none; }
.toast { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 10px; align-items: center; padding: 13px 15px; border: 1px solid rgba(96,211,148,.25); border-radius: 11px; background: #142b35; box-shadow: var(--shadow); color: #dff9e9; font-size: 13px; font-weight: 700; animation: toast-in .2s ease-out; }
.toast.error { border-color: rgba(241,123,123,.3); color: #ffd0d0; }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }
.loading-block { min-height: 140px; display: grid; place-items: center; color: var(--muted); }


@media (max-width: 1120px) {
  :root { --sidebar-width: 204px; }
  .dashboard-grid > .span-7, .dashboard-grid > .span-5 { grid-column: span 12; }
  .table-row.user-row { grid-template-columns: minmax(160px,1fr) minmax(100px,.7fr) minmax(110px,.75fr); }
  .table-row.user-row > :nth-child(4) { display: none; }
  .audit-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }
  .auth-shell, .auth-card, .app-layout, .app-stage, .topbar, .content, .view {
    max-width: 100%;
    min-width: 0;
  }
  .auth-shell, .app-layout, .app-stage, .topbar, .content, .view { width: 100%; }
  /* Safari amplía automáticamente los formularios cuyo texto mide menos de 16 px. */
  body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    font-size: 16px;
  }
  .app-layout { display: block; }
  .app-stage { min-height: 100dvh; }
  .sidebar {
    inset: 0 auto 0 0; width: min(300px, 86vw); transform: translateX(-102%);
    transition: transform .18s ease; box-shadow: 20px 0 60px rgba(0,0,0,.4);
    padding-top: max(22px, env(safe-area-inset-top));
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }
  body.menu-open::after { content: ""; position: fixed; inset: 0; z-index: 35; background: rgba(2,7,11,.64); }
  body.menu-open .sidebar { transform: translateX(0); }
  .menu-button { display: grid; }
  .sidebar-close { display: grid; }
  .topbar {
    min-height: 58px;
    padding-top: max(6px, env(safe-area-inset-top));
    padding-right: max(14px, env(safe-area-inset-right));
    padding-bottom: 6px;
    padding-left: max(14px, env(safe-area-inset-left));
  }
  .icon-button, .button, .main-nav button { min-height: 44px; }
  .button.small, .segmented button, .manager-tabs button, .menu-action, .refresh-retry { min-height: 44px; }
  .icon-button { width: 44px; height: 44px; }
  .user-menu summary { min-width: 0; width: min(156px, 32vw); padding: 4px 8px 4px 4px; grid-template-columns: 34px minmax(0,1fr); }
  .user-copy { display: grid; }
  .user-copy small { display: none; }
  .user-menu-panel { right: -2px; }
  .content { padding: 21px max(15px, env(safe-area-inset-right)) max(36px, env(safe-area-inset-bottom)) max(15px, env(safe-area-inset-left)); }
  .dashboard-grid > .span-4, .dashboard-grid > .span-8 { grid-column: span 12; }
  .view-head.split { align-items: flex-start; flex-direction: column; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .search-field, .search-field.small { min-width: 0; width: 100%; }
  .duty-card { grid-template-columns: 62px minmax(0,1fr); }
  .duty-actions { grid-column: 1 / -1; justify-content: flex-start; padding-left: 79px; }
  .change-card { grid-template-columns: 1fr; }
  .change-actions { justify-content: flex-start; }
  .schedule-header { align-items: flex-start; }
  .planner-filters { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .planner-filters > label:first-child { grid-column: span 2; }
  .appointment-row { grid-template-columns: minmax(130px,.7fr) minmax(180px,1.2fr) repeat(2,minmax(100px,.6fr)); }
  .appointment-row > .appointment-meta:nth-of-type(4) { display: none; }
  .appointment-actions { grid-column: 1 / -1; justify-content: flex-end; padding-top: 7px; border-top: 1px solid var(--border); }
  .personnel-row { grid-template-columns: minmax(220px,1.25fr) minmax(210px,.9fr); }
  .personnel-actions { grid-column: 1 / -1; justify-content: flex-end; padding-top: 7px; border-top: 1px solid var(--border); }
  .access-row { grid-template-columns: minmax(220px,1.2fr) repeat(3,minmax(110px,.6fr)); }
  .access-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .table-row, .table-row.roster-row, .table-row.user-row { grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
  .table-row > .table-cell, .table-row.roster-row > .table-cell, .table-row.user-row > .table-cell { display: none; }
  .table-actions { grid-column: 2; grid-row: 1; }
  .table-row.user-row .table-actions { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .table-row.roster-row .table-actions { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .recovery-row { grid-template-columns: minmax(0,1fr); }
  .recovery-actions { justify-content: flex-start; }
  .import-layout { grid-template-columns: 1fr; }
}

@media (min-width: 860px) and (max-width: 1024px) {
  #view-personnel .personnel-list-head { display: grid; grid-template-columns: minmax(240px,1.1fr) minmax(220px,.85fr) auto; gap: 14px; padding: 8px 14px; border-bottom: 1px solid var(--border); background: rgba(5,16,24,.3); color: #708996; font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
  #view-personnel .personnel-list-head span:last-child { min-width: 228px; text-align: right; }
  #view-personnel .personnel-row { grid-template-columns: minmax(240px,1.1fr) minmax(220px,.85fr) auto; gap: 14px; }
  #view-personnel .personnel-state-label { display: none; }
  #view-personnel .personnel-actions { grid-column: auto; padding-top: 0; border-top: 0; }
}

@media (max-width: 720px) {
  .schedule-incident { min-height: 44px; height: auto; }
  .management-action-row.incident { position: relative; display: block; padding: 14px 12px; }
  .management-action-row.incident .management-action-icon { position: absolute; top: 14px; left: 12px; width: 36px; height: 36px; }
  .management-action-row.incident .management-incident-copy { width: 100%; }
  .management-incident-heading { grid-template-columns: 1fr; gap: 6px; }
  .management-action-row.incident .management-incident-heading { min-height: 36px; padding-left: 48px; }
  .management-incident-heading .status-chip { justify-self: start; }
  .management-incident-reason { grid-template-columns: 1fr; gap: 2px; }
  .management-action-row.incident .management-action-actions { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 11px; padding-top: 10px; }
  .schedule-desktop { display: none; }
  .calendar-mobile { display: grid; gap: 10px; }
  .schedule-view-switcher { width: 100%; }
  .schedule-view-switcher button { flex: 1 1 50%; }
  .calendar-mobile-month { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 3px; padding: 7px; border: 1px solid var(--border); border-radius: 13px; background: rgba(8,22,32,.72); }
  .calendar-mobile-month-head { min-height: 25px; display: grid; place-items: center; color: var(--muted); font-size: 9px; font-weight: 900; }
  .calendar-mobile-month-head.weekend-start { background: rgba(129,152,167,.025); color: var(--text-soft); }
  .calendar-mobile-month-head.weekend { background: rgba(129,152,167,.055); color: var(--text-soft); }
  .calendar-mobile-month-day { position: relative; min-width: 0; min-height: 58px; display: grid; grid-template-rows: auto 8px auto; place-items: center; gap: 3px; padding: 6px 2px; border: 1px solid transparent; border-radius: 8px; background: rgba(16,33,46,.5); color: var(--muted); }
  .calendar-mobile-month-day.has-services { border-color: var(--border); color: var(--text); background: rgba(23,45,59,.76); }
  .calendar-mobile-month-day.weekend-start { background: rgba(129,152,167,.045); }
  .calendar-mobile-month-day.weekend { background: rgba(129,152,167,.085); }
  .calendar-mobile-month-day.off { opacity: .56; background: rgba(5,15,23,.52); }
  .calendar-mobile-month-day.off.has-own-service { opacity: .78; }
  .calendar-mobile-month-day.off.today, .calendar-mobile-month-day.off.selected { opacity: .88; }
  .calendar-mobile-month-day.has-own-service { border-color: rgba(210,165,109,.8); background: linear-gradient(145deg,rgba(210,165,109,.24),rgba(23,45,59,.92)); color: var(--text); box-shadow: inset 0 0 0 1px rgba(210,165,109,.2); }
  .calendar-mobile-month-day.today { border-color: var(--teal); }
  .calendar-mobile-month-day.today > strong { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: var(--teal); color: #06211f; }
  .calendar-mobile-month-day.selected { box-shadow: 0 0 0 2px rgba(86,200,242,.38); }
  .calendar-mobile-month-day.has-issue::after { content: ""; position: absolute; top: 5px; right: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--red); }
  .calendar-mobile-month-day > strong { font-size: 11px; font-variant-numeric: tabular-nums; }
  .calendar-mobile-month-day > small { color: var(--text-soft); font-size: 8px; font-weight: 850; }
  .calendar-mobile-month-day.has-own-service > small { color: #e7c89f; }
  .calendar-mobile-month-dots { min-height: 6px; display: flex; justify-content: center; gap: 2px; }
  .calendar-mobile-month-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); }
  .calendar-mobile-month-dots i.source-gs { background: var(--gold); }
  .calendar-mobile-month-help { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 10px; border: 1px solid rgba(210,165,109,.2); border-radius: 9px; background: rgba(210,165,109,.07); color: var(--text-soft); font-size: 11px; line-height: 1.45; text-align: left; }
  .calendar-mobile-own-key { flex: 0 0 11px; width: 11px; height: 11px; border: 1px solid rgba(210,165,109,.85); border-radius: 4px; background: linear-gradient(145deg,rgba(210,165,109,.52),rgba(23,45,59,.92)); box-shadow: inset 0 0 0 1px rgba(210,165,109,.18); }
  .calendar-mobile-month-detail { display: grid; gap: 9px; padding: 13px; border: 1px solid var(--border); border-radius: 12px; background: rgba(16,33,46,.78); }
  .calendar-mobile-month-detail > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .calendar-mobile-month-detail h3 { margin: 0; color: var(--text-soft); font-size: 13px; }
  .calendar-mobile-month-detail > div { display: grid; gap: 8px; }
  .calendar-mobile-month-detail .schedule-assignment { margin: 0; }
  .calendar-mobile-day { display: grid; gap: 9px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: rgba(16,33,46,.7); }
  .calendar-mobile-day.weekend-start { background: rgba(129,152,167,.035); }
  .calendar-mobile-day.weekend { background: rgba(129,152,167,.065); }
  .calendar-mobile-day.today { border-color: rgba(67,214,197,.35); }
  .calendar-mobile-day.has-own-service { border-color: rgba(210,165,109,.72); background: linear-gradient(145deg,rgba(210,165,109,.15),rgba(16,33,46,.86)); box-shadow: inset 3px 0 0 var(--own-service); }
  .calendar-mobile-day > header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
  .calendar-mobile-day > header span { color: var(--teal); font-size: 9px; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
  .calendar-mobile-day h3 { margin: 0; color: var(--text-soft); font-size: 13px; }
  .calendar-mobile-day .schedule-assignment { margin: 0; padding: 11px 11px 11px 14px; }
  .calendar-mobile-day .schedule-person { grid-template-columns: 34px minmax(0,1fr); }
  .calendar-mobile-day .schedule-avatar { width: 34px; height: 34px; }
  .calendar-mobile-day .schedule-person-copy strong { font-size: 13px; }
  .calendar-mobile-day .schedule-assignment-service { font-size: 11px; }
  .schedule-mobile-empty { margin: 0; color: var(--muted); font-size: 11px; }
  .calendar-legend { margin-bottom: 8px; }
  .planner-toolbar-head { align-items: stretch; flex-direction: column; }
  .planner-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .planner-filters > label:first-child { grid-column: span 2; }
  .appointment-row { grid-template-columns: minmax(120px,.65fr) minmax(0,1.2fr); gap: 8px 12px; }
  .appointment-row .appointment-meta { display: grid !important; }
  .appointment-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .personnel-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .personnel-search { grid-column: span 2; }
  .personnel-row, .access-row { grid-template-columns: minmax(0,1fr) minmax(130px,.58fr); gap: 10px; }
  .personnel-identity, .access-identity { grid-row: span 2; }
  .personnel-actions, .access-actions { grid-column: 1 / -1; justify-content: flex-start; }
  #view-personnel .personnel-panel > .panel-head { padding: 11px 12px; }
  #view-personnel .personnel-panel > .panel-head .eyebrow { display: none; }
  #view-personnel .personnel-panel > .panel-head > div { width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
  #view-personnel .personnel-panel > .panel-head h3, #view-personnel .personnel-panel > .panel-head .panel-meta { margin: 0; }
  #view-personnel .personnel-list { gap: 6px; padding: 6px; background: rgba(4,13,20,.2); }
  #view-personnel .personnel-row { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "identity status" "actions actions"; gap: 9px 8px; min-height: 0; padding: 10px 10px 10px 13px; align-items: start; border: 1px solid var(--border); border-radius: 10px; background: rgba(12,29,41,.62); }
  #view-personnel .personnel-row.has-operational-detail { grid-template-areas: "identity status" "detail detail" "actions actions"; }
  #view-personnel .personnel-row::before { inset-block: 10px; }
  #view-personnel .personnel-row:last-child { border-bottom: 1px solid var(--border); }
  #view-personnel .personnel-identity { grid-area: identity; grid-row: auto; grid-template-columns: 38px minmax(0,1fr); gap: 10px; align-items: center; }
  #view-personnel .personnel-identity > .schedule-avatar { width: 38px; height: 38px; font-size: 10px; }
  #view-personnel .personnel-identity-copy { gap: 2px; }
  #view-personnel .personnel-identity-heading { gap: 4px 7px; }
  #view-personnel .personnel-identity strong { font-size: 14px; line-height: 1.3; overflow-wrap: break-word; word-break: normal; }
  #view-personnel .personnel-company { display: none; }
  #view-personnel .personnel-state-label { display: none; }
  #view-personnel .personnel-operational-state, #view-personnel .personnel-operational-copy { display: contents; }
  #view-personnel .personnel-operational-copy > .availability-chip { grid-area: status; align-self: start; justify-self: end; min-height: 28px; padding-inline: 9px; font-size: 10px; white-space: nowrap; }
  #view-personnel .personnel-operational-detail { grid-area: detail; min-width: 0; display: grid; gap: 2px; padding: 8px 10px; border: 1px solid rgba(196,216,229,.1); border-radius: 8px; background: rgba(7,20,29,.32); }
  #view-personnel .personnel-operational-detail > strong { font-size: 13px; line-height: 1.35; }
  #view-personnel .personnel-operational-detail > span { font-size: 10px; line-height: 1.4; }
  #view-personnel .personnel-actions { grid-area: actions; grid-column: auto; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); justify-content: stretch; gap: 7px; padding: 0; border-top: 0; }
  #view-personnel .personnel-actions .button { width: 100%; min-width: 0; min-height: 44px; font-size: 12px; }
  .role-card-grid { grid-template-columns: 1fr; }
  .audit-table-shell { overflow: visible; border: 0; }
  .audit-table, .audit-table tbody { min-width: 0; display: block; }
  .audit-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .audit-table tbody { display: grid; gap: 10px; }
  .audit-table tr { display: grid; padding: 6px 12px; border: 1px solid var(--border); border-radius: 11px; background: rgba(6,18,27,.3); }
  .audit-table td { display: grid; grid-template-columns: minmax(84px, .38fr) minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
  .audit-table td::before { content: attr(data-label); color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
  .audit-table td:last-child { border-bottom: 0; }
  .audit-row-action { text-align: left; }
  .audit-row-action .button { justify-self: start; }
  .audit-detail-preview { white-space: normal; }
  .import-table-shell { overflow: visible; border: 0; }
  .import-table, .import-table tbody { min-width: 0; display: block; }
  .import-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  .import-table tbody { display: grid; gap: 8px; }
  .import-table tr { display: grid; padding: 5px 11px; border: 1px solid var(--border); border-radius: 10px; background: rgba(7,20,29,.35); }
  .import-table td { display: grid; grid-template-columns: minmax(94px,.38fr) minmax(0,1fr); gap: 9px; padding: 7px 0; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
  .import-table td::before { content: attr(data-label); color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
  .import-table td:last-child { border-bottom: 0; }
}

@media (max-width: 560px) {
  body { font-size: 14px; }
  .auth-shell {
    padding-top: max(14px, env(safe-area-inset-top));
    padding-right: max(14px, env(safe-area-inset-right));
    padding-bottom: max(14px, env(safe-area-inset-bottom));
    padding-left: max(14px, env(safe-area-inset-left));
  }
  .auth-card { padding: 24px 20px; border-radius: 18px; }
  .onboarding-preference { grid-template-columns: minmax(0,1fr); gap: 9px; }
  .onboarding-choice { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .onboarding-choice span { min-height: 40px; }
  .auth-brand { align-items: flex-start; gap: 14px; }
  .auth-emblem { width: 65px; height: 78px; }
  .auth-brand h1 { font-size: 31px; }
  .page-identity h1 { font-size: 18px; }
  .content { padding-right: max(12px, env(safe-area-inset-right)); padding-left: max(12px, env(safe-area-inset-left)); }
  .panel { border-radius: 14px; }
  .personal-heading { display: grid; gap: 4px; margin-bottom: 17px; }
  .personal-heading h2 { font-size: 23px; }
  .service-row { grid-template-columns: 1fr; gap: 7px; padding-block: 15px; }
  .service-row-main strong { white-space: normal; }
  .service-row-actions { width: 100%; justify-content: flex-start; }
  .service-row-actions .button.secondary { flex: 1 1 100%; }
  .planner-filters, .personnel-filters { grid-template-columns: 1fr; }
  .planner-filters > label:first-child, .personnel-search { grid-column: span 1; }
  .planner-filters .button, .personnel-filters .button { width: 100%; }
  .appointment-row { grid-template-columns: 1fr; padding: 13px 12px 13px 16px; }
  .appointment-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .appointment-actions .button { width: 100%; }
  .personnel-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .personnel-row, .access-row { grid-template-columns: 1fr; padding: 14px; }
  .personnel-identity, .access-identity { grid-row: auto; }
  .personnel-actions, .access-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .personnel-actions .button, .access-actions .button { width: 100%; }
  .person-detail-section-head { flex-direction: column; align-items: stretch; }
  .person-detail-section-head > .button { width: 100%; min-height: 44px; }
  .person-deduction-main { grid-template-columns: 1fr; }
  .person-deduction-main time { grid-column: 1; }
  .person-deduction-actions { display: grid; grid-template-columns: 1fr; }
  .person-deduction-actions .button { width: 100%; }
  .schedule-person-card > header { grid-template-columns: 38px minmax(0,1fr); }
  .schedule-person-card > header .availability-chip { grid-column: 2; }
  .schedule-person-duty { grid-template-columns: 1fr; gap: 5px; }
  .schedule-duty-state { justify-items: start; }
  .management-composer > .dashboard-grid, .management-composer > .panel { margin: 9px; }
  .management-action-row { grid-template-columns: 38px minmax(0,1fr); }
  .management-action-row > .button, .management-action-actions { grid-column: 2; justify-self: start; }
  .management-action-actions { justify-content: flex-start; }
  .management-action-row.incident { grid-template-columns: 38px minmax(0,1fr); }
  .management-action-row.incident .management-action-actions { width: 100%; grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .management-action-row.incident .management-action-actions .button { width: 100%; }
  .impact-resolution-modal { max-height: calc(100dvh - 16px); padding: 19px 16px; }
  .impact-resolution-context-meta { grid-template-columns: 1fr; }
  .impact-resolution-option { padding: 12px 10px; }
  .impact-resolution-modal .modal-actions { display: grid; grid-template-columns: 1fr; }
  .impact-resolution-modal .modal-actions .button { width: 100%; }
  .refresh-status { max-width: 132px; overflow: hidden; padding-inline: 3px; }
  .refresh-status > span:not(.refresh-indicator) { overflow: hidden; text-overflow: ellipsis; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: span 1; }
  .schedule-header { display: grid; gap: 13px; }
  .schedule-view-switcher { width: 100%; }
  .schedule-view-switcher button { flex: 1 1 0; min-height: 44px; padding-inline: 8px; }
  .schedule-period-bar { grid-template-columns: 1fr; gap: 8px; }
  .schedule-period-actions { justify-content: space-between; }
  .schedule-period { grid-row: 1; text-align: left; }
  .schedule-incidents { display: grid; grid-template-columns: 1fr; }
  .schedule-incident { width: 100%; justify-content: flex-start; border-radius: 9px; }
  .manager-tabs { overflow-x: auto; }
  .manager-tabs button { white-space: nowrap; flex: 1 0 auto; }
  .duty-card { gap: 12px; padding: 13px; }
  .duty-actions { padding-left: 0; }
  .duty-actions .button { width: 100%; }
  .modal { padding: 20px 16px; }
  .user-actions { width: 100%; display: grid; grid-template-columns: repeat(auto-fit,minmax(132px,1fr)); }
  .user-action-button { width: 100%; min-width: 0; }
  .roster-actions { width: 100%; display: grid; grid-template-columns: repeat(auto-fit,minmax(110px,1fr)); }
  .roster-actions .button { width: 100%; min-width: 0; }
  .service-detail-list { grid-template-columns: 1fr; gap: 11px; }
  .service-detail-modal { width: 100%; padding: max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); border-left: 0; }
  .service-detail-modal .modal-actions { position: sticky; bottom: 0; margin: 8px -2px -8px; padding-top: 10px; background: linear-gradient(transparent,#10212e 20%); }
  .modal-actions .button { flex: 1 1 150px; }
  .audit-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .audit-summary-card { padding: 12px; }
  .audit-summary-card small { display: none; }
  .audit-text-filter { grid-column: span 1; }
  .audit-filter-actions .button { flex: 1 1 130px; }
  .audit-results-head { align-items: stretch; }
  .audit-page-size { width: 100%; }
  .audit-pagination { justify-content: stretch; flex-wrap: wrap; }
  .audit-pagination > span { width: 100%; order: -1; }
  .audit-pagination .button { flex: 1 1 120px; }
  .audit-detail-meta { grid-template-columns: 1fr; gap: 8px; }
  .audit-detail-list > div { grid-template-columns: 1fr; gap: 5px; }
  .import-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .import-confirm .button { width: 100%; }
}

@media (max-width: 390px) {
  .service-row-actions { display: grid; grid-template-columns: 1fr; }
  .service-row-actions .button { width: 100%; }
  .appointment-actions, .personnel-actions, .access-actions { grid-template-columns: 1fr; }
  .personnel-summary article { padding: 10px; }
  .personnel-summary strong { font-size: 18px; }
  .schedule-view-switcher button { font-size: 10px; }
  .refresh-status { max-width: 26px; }
  .refresh-status > span:not(.refresh-indicator) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  .refresh-status.error { max-width: none; overflow: visible; }
  .refresh-retry:not(.hidden) { position: static; width: auto; height: 44px; clip: auto; }
  .user-menu-panel { width: min(290px, calc(100vw - 24px)); }
  .user-menu summary { width: min(128px, 34vw); grid-template-columns: 34px minmax(0,1fr); }
  .user-menu .user-copy { display: grid; }
}

/* Native-style mobile experience */
.mobile-brand-home,
.mobile-alerts-button,
.mobile-bottom-nav,
.mobile-week-context,
.mobile-mine-attention,
.mobile-operations-summary,
.mobile-service-state,
.mobile-upcoming-label,
.change-detail-mobile,
.change-status-mobile { display: none; }
.calendar-legend .legend-service-type { display: inline-flex; }

.account-view { width: min(720px, 100%); }
.account-view-head { margin-bottom: 16px; }
.account-hero {
  display: grid; grid-template-columns: 64px minmax(0,1fr); align-items: center; gap: 15px;
  padding: 20px; border: 1px solid var(--border); border-radius: 16px;
  background: linear-gradient(145deg,rgba(67,214,197,.08),rgba(16,33,46,.72));
}
.account-avatar { width: 64px; height: 64px; font-size: 18px; }
.account-hero > div { min-width: 0; display: grid; gap: 3px; }
.account-hero strong { overflow: hidden; text-overflow: ellipsis; font-size: 20px; white-space: nowrap; }
.account-hero span:not(.avatar) { color: var(--text-soft); font-size: 13px; }
.account-hero small { color: var(--muted); font-size: 11px; }
.account-section { margin-top: 12px; padding: 17px; border: 1px solid var(--border); border-radius: 14px; background: rgba(16,33,46,.66); }
.account-section h3 { margin: 0; font-size: 15px; }
.account-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.account-section-heading > div { display: grid; gap: 3px; }
.account-section-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.account-data-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; margin: 12px 0 0; }
.account-data-list > div { min-width: 0; display: grid; gap: 4px; padding: 12px 0; border-top: 1px solid var(--border); }
.account-data-list > div:nth-child(odd) { padding-right: 14px; }
.account-data-list > div:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--border); }
.account-data-list dt { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.account-data-list dd { margin: 0; overflow-wrap: anywhere; color: var(--text-soft); font-size: 13px; font-weight: 720; }
.account-preference-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; padding: 4px; border: 1px solid var(--border); border-radius: 10px; background: rgba(7,20,29,.62); }
.account-preference-options button { min-height: 42px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; }
.account-preference-options button.active { border-color: rgba(67,214,197,.2); background: rgba(67,214,197,.09); color: var(--text); }
.account-notification-preferences { min-width: 0; display: grid; gap: 8px; margin: 17px 0 0; padding: 16px 0 0; border: 0; border-top: 1px solid var(--border); }
.account-notification-preferences legend { width: 100%; margin: 0; padding: 0 0 4px; color: var(--text); font-size: 13px; font-weight: 850; }
.account-notification-help { margin: 0 0 3px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.account-notification-option { min-width: 0; min-height: 54px; display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 10px; align-items: start; padding: 11px; border: 1px solid var(--border); border-radius: 10px; background: rgba(7,20,29,.42); cursor: pointer; }
.account-notification-option:hover { border-color: rgba(67,214,197,.24); background: rgba(67,214,197,.035); }
.account-notification-option:has(input:focus-visible) { outline: 3px solid rgba(67,214,197,.22); outline-offset: 1px; }
.account-notification-option input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--teal); }
.account-notification-option > span { min-width: 0; display: grid; gap: 3px; }
.account-notification-option strong { color: var(--text-soft); font-size: 12px; line-height: 1.35; }
.account-notification-option small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.account-notification-option:has(input:checked) { border-color: rgba(67,214,197,.24); background: rgba(67,214,197,.055); }
.account-notification-option:has(input:disabled) { cursor: not-allowed; opacity: .62; }
.account-notification-actions { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 9px 12px; padding-top: 3px; }
.account-notification-actions .button { min-height: 44px; }
.account-notification-actions p { min-width: 0; flex: 1 1 200px; margin: 0; color: var(--text-soft); font-size: 10px; line-height: 1.45; }
.account-action { width: 100%; min-height: 54px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 8px 4px; border: 0; background: transparent; color: var(--text); text-align: left; }
.account-action-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: rgba(67,214,197,.08); color: var(--teal); }
.account-action > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.account-action strong { font-size: 13px; }
.account-action small { color: var(--muted); font-size: 10px; }
.account-action > span:last-child { color: var(--muted); font-size: 24px; }
.account-logout { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 12px; border: 1px solid rgba(241,123,123,.2); border-radius: 12px; background: rgba(241,123,123,.045); color: #ffb4b4; font-size: 13px; font-weight: 800; }
.account-logout-icon { display: grid; }
.account-version { margin: 18px 0 0; color: #607886; font-size: 10px; text-align: center; }
.change-facts { display: none; gap: 7px; margin: 0; }
.change-facts > div { display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 8px; }
.change-facts dt { color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.change-facts dd { margin: 0; color: var(--text-soft); font-size: 11px; line-height: 1.45; }
.personal-change-group { display: grid; gap: 8px; }
.personal-change-group + .personal-change-group { margin-top: 18px; }
.personal-change-group-title { display: none; }
.personal-change-group > div { display: grid; gap: 10px; }
.history-summary { margin: -5px 0 12px; color: var(--muted); font-size: 11px; }

@media (max-width: 720px) {
  :root { --mobile-nav-height: 72px; }
  body { background: #06111a; }
  .app-stage { min-height: 100dvh; padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)); }
  .topbar {
    min-height: 60px; display: grid; grid-template-columns: auto auto minmax(0,1fr); gap: 7px;
    padding: max(7px,env(safe-area-inset-top)) max(11px,env(safe-area-inset-right)) 7px max(11px,env(safe-area-inset-left));
    background: rgba(6,17,26,.95); backdrop-filter: blur(20px); box-shadow: 0 7px 24px rgba(0,0,0,.16);
  }
  .menu-button { grid-column: 2; }
  .menu-button[hidden] { display: none !important; }
  .menu-button.management-mode {
    width: auto; min-width: 82px; height: 42px; display: grid; grid-template-columns: 18px auto; align-items: center; gap: 6px;
    padding: 0 10px; border: 1px solid rgba(67,214,197,.18); border-radius: 11px; background: rgba(67,214,197,.07); color: #c9fff8;
  }
  .menu-button.management-mode:hover, .menu-button.management-mode:focus-visible { border-color: rgba(67,214,197,.38); background: rgba(67,214,197,.11); }
  .mobile-management-icon { display: grid; place-items: center; }
  .mobile-management-icon .ui-icon { width: 18px; height: 18px; }
  .mobile-management-label { font-size: 10px; font-weight: 850; letter-spacing: .025em; }
  .topbar.no-mobile-management .mobile-brand-home { grid-column: 1; justify-self: start; }
  .mobile-brand-home {
    grid-column: 1; grid-row: 1;
    min-width: 58px; height: 44px; display: grid; grid-template-columns: 24px auto; align-items: center; gap: 6px;
    padding: 3px 6px; border: 0; border-radius: 9px; background: transparent; color: var(--text-soft); cursor: pointer;
  }
  .mobile-brand-home img { width: 24px; height: 32px; object-fit: contain; filter: drop-shadow(0 4px 7px rgba(0,0,0,.3)); }
  .mobile-brand-home span { font-size: 9px; font-weight: 900; letter-spacing: .08em; white-space: nowrap; }
  .sidebar .brand-lockup { display: none; }
  .sidebar-management-title { min-width: 0; display: flex; align-items: center; gap: 10px; color: var(--text); }
  .sidebar-management-title > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: rgba(67,214,197,.09); color: var(--teal); }
  .sidebar-management-title > span .ui-icon { width: 20px; height: 20px; }
  .sidebar-management-title > div { min-width: 0; display: grid; gap: 2px; }
  .sidebar-management-title strong { font-size: 15px; }
  .sidebar-management-title div span { color: var(--muted); font-size: 9px; }
  .sidebar #mainNav .nav-group.personal { display: none; }
  .sidebar #mainNav .nav-group.personal + .nav-group.management { margin-top: 0; padding-top: 0; border-top: 0; }
  .page-identity { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  .topbar-actions { grid-column: 3; min-width: 0; display: grid; grid-template-columns: 42px minmax(0,116px); justify-content: end; gap: 6px; }
  .refresh-status { display: none !important; }
  .mobile-alerts-button {
    position: relative; width: 42px; height: 42px; display: grid; place-items: center; padding: 0;
    border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--text-soft);
  }
  .mobile-alerts-button:hover, .mobile-alerts-button:focus-visible { border-color: var(--border); background: rgba(255,255,255,.035); color: var(--text); }
  .mobile-alerts-button .ui-icon { width: 21px; height: 21px; }
  .mobile-alerts-badge, .mobile-nav-badge {
    position: absolute; min-width: 16px; height: 16px; display: grid; place-items: center; padding: 0 4px;
    border: 2px solid #08131d; border-radius: 99px; background: var(--amber); color: #241904; font-size: 8px; font-weight: 950;
  }
  .mobile-alerts-badge { top: 2px; right: 1px; }
  .user-menu summary { width: 116px; height: 42px; padding: 3px 7px 3px 3px; grid-template-columns: 32px minmax(0,1fr); gap: 6px; border-color: rgba(67,214,197,.13); background: linear-gradient(135deg,rgba(67,214,197,.065),rgba(16,33,46,.72)); }
  .user-menu summary:hover, .user-menu[open] summary { border-color: rgba(67,214,197,.28); background: linear-gradient(135deg,rgba(67,214,197,.1),rgba(19,39,53,.86)); }
  .user-menu summary .avatar { width: 32px; height: 32px; }
  .user-copy strong { font-size: 11px; }
  .user-menu-panel { top: 47px; }
  .content {
    padding: 18px max(13px,env(safe-area-inset-right)) calc(32px + var(--mobile-nav-height) + env(safe-area-inset-bottom)) max(13px,env(safe-area-inset-left));
  }
  .mobile-bottom-nav {
    position: fixed; inset: auto 0 0; z-index: 32; min-height: var(--mobile-nav-height);
    display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); align-items: stretch;
    padding: 4px max(5px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left));
    border-top: 1px solid rgba(196,216,229,.14); background: rgba(8,19,29,.97); backdrop-filter: blur(22px); box-shadow: 0 -12px 32px rgba(0,0,0,.25);
  }
  .mobile-bottom-nav button {
    position: relative; min-width: 0; min-height: 60px; display: grid; grid-template-rows: 27px auto; place-items: center; align-content: center; gap: 2px;
    padding: 5px 2px 3px; border: 0; border-radius: 10px; background: transparent; color: #78909e; font-size: 9px; font-weight: 780; line-height: 1.05;
  }
  .mobile-bottom-nav button::before { content: ""; position: absolute; top: -4px; left: 28%; right: 28%; height: 2px; border-radius: 0 0 2px 2px; background: transparent; }
  .mobile-bottom-nav button.active { color: #b9fff6; }
  .mobile-bottom-nav button.active::before { background: var(--teal); box-shadow: 0 2px 9px rgba(67,214,197,.38); }
  .mobile-bottom-nav button:focus-visible { outline: 2px solid rgba(67,214,197,.45); outline-offset: -3px; }
  .mobile-nav-icon { position: relative; display: grid; place-items: center; }
  .mobile-nav-icon .ui-icon { width: 22px; height: 22px; stroke-width: 1.9; }
  .mobile-nav-badge { top: -5px; left: 13px; }
  body.menu-open .mobile-bottom-nav { opacity: .22; }
  body.modal-open .mobile-bottom-nav { visibility: hidden; }
  .toast-region { right: 12px; bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 10px); width: calc(100vw - 24px); }

  .view-head { align-items: flex-start; margin-bottom: 15px; }
  .view-head h2 { margin: 0 0 4px; font-size: 24px; }
  .view-head p { margin: 0; font-size: 12px; line-height: 1.45; }
  .personal-heading { display: grid; gap: 3px; margin-bottom: 13px; }
  .personal-heading h2 { order: -1; font-size: 25px; line-height: 1.1; }
  .personal-date { color: var(--muted); font-size: 11px; }
  .mobile-week-context {
    width: 100%; min-height: 50px; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 9px;
    margin-bottom: 11px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 12px; background: rgba(16,33,46,.46); color: var(--text); text-align: left;
  }
  .mobile-week-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: rgba(67,214,197,.075); color: var(--teal); }
  .mobile-week-icon .ui-icon { width: 18px; height: 18px; }
  .mobile-week-context > span:nth-child(2) { min-width: 0; display: grid; gap: 1px; }
  .mobile-week-context small { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
  .mobile-week-context strong { overflow: hidden; text-overflow: ellipsis; color: var(--text-soft); font-size: 11px; white-space: nowrap; }
  .mobile-week-action { color: var(--teal); font-size: 10px; font-weight: 820; white-space: nowrap; }
  .mobile-mine-attention {
    min-height: 58px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 9px;
    margin-bottom: 14px; padding: 9px 9px 9px 10px; border: 1px solid rgba(245,191,86,.19); border-radius: 12px; background: rgba(245,191,86,.055);
  }
  .mobile-mine-attention.hidden { display: none; }
  .mobile-attention-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: rgba(245,191,86,.1); color: #f4ca77; }
  .mobile-attention-icon .ui-icon { width: 18px; height: 18px; }
  .mobile-mine-attention > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
  .mobile-mine-attention strong { font-size: 11px; }
  .mobile-mine-attention small { overflow: hidden; text-overflow: ellipsis; color: var(--muted); font-size: 9px; white-space: nowrap; }
  .mobile-mine-attention .button { min-height: 40px; padding-inline: 8px; }
  .services-column { width: 100%; }
  .services-overview { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .services-panel-head { padding: 5px 1px 10px; border-bottom: 0; }
  .services-panel-head h3 { font-size: 15px; }
  .desktop-upcoming-label,
  .change-detail-desktop,
  .change-reviewer-desktop,
  .change-status-desktop { display: none; }
  .mobile-upcoming-label,
  .change-detail-mobile,
  .change-status-mobile { display: inline; }
  .personal-services-list { display: grid; gap: 9px; }
  #view-mine .service-row {
    min-height: 0; display: grid; grid-template-columns: 70px minmax(0,1fr); align-items: start; gap: 8px 12px;
    padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: rgba(16,33,46,.68); box-shadow: 0 8px 22px rgba(0,0,0,.08);
  }
  #view-mine .service-row.is-next { border-color: rgba(67,214,197,.38); background: linear-gradient(140deg,rgba(67,214,197,.095),rgba(16,33,46,.78) 54%); box-shadow: inset 3px 0 0 var(--teal),0 9px 24px rgba(0,0,0,.12); }
  #view-mine .service-row-date {
    grid-column: 1; grid-row: 1 / span 2; min-height: 66px; align-content: center; justify-items: center; gap: 3px;
    padding: 8px 5px; border-radius: 11px; background: rgba(86,200,242,.07); color: var(--text-soft); text-align: center;
  }
  #view-mine .service-row.is-next .service-row-date { background: rgba(67,214,197,.085); }
  #view-mine .service-row-date strong { font-size: 11px; line-height: 1.35; }
  #view-mine .next-service-chip { min-height: 17px; padding-inline: 5px; font-size: 7px; }
  #view-mine .service-row-main { grid-column: 2; gap: 5px; padding-top: 1px; }
  #view-mine .service-row-main > strong { font-size: 15px; line-height: 1.25; white-space: normal; }
  #view-mine .service-origin { display: none; }
  .mobile-service-state { width: fit-content; max-width: 100%; display: inline-flex; align-items: center; gap: 5px; min-height: 22px; padding: 2px 7px; border: 1px solid var(--border); border-radius: 99px; color: var(--text-soft); font-size: 9px; font-weight: 780; }
  .mobile-service-state b { color: var(--cyan); font-size: 8px; letter-spacing: .045em; }
  .mobile-service-state.pending { border-color: rgba(245,191,86,.23); background: rgba(245,191,86,.075); color: #f6d493; }
  .mobile-service-state.changed { border-color: rgba(181,160,245,.24); background: rgba(181,160,245,.075); color: #d8cbff; }
  .mobile-service-state.recovery { border-color: rgba(96,211,148,.22); background: rgba(96,211,148,.07); color: #b9eccd; }
  .mobile-service-state.return { border-color: rgba(245,191,86,.22); background: rgba(245,191,86,.07); color: #f6d493; }
  #view-mine .own-service-change { margin-top: 0; }
  #view-mine .own-service-change > strong { display: none; }
  #view-mine .own-service-change > small { color: #9fb0ba; line-height: 1.35; }
  #view-mine .service-row-actions { grid-column: 2; width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 5px; }
  #view-mine .service-row-actions .button { width: auto; min-height: 40px; padding: 7px 10px; }
  #view-mine .service-row-actions .button.secondary { flex: 1 1 128px; }
  #view-mine .service-row-actions .button.text { flex: 0 0 auto; }
  #view-mine .service-row-actions .button.danger:last-child { flex: 1 1 100%; justify-content: flex-start; min-height: 34px; padding-left: 0; }
  .mobile-operations-summary {
    display: grid; gap: 7px; margin-top: 14px; padding: 12px 0 2px; border-top: 1px solid var(--border);
  }
  .summary-month-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 4px; }
  .summary-month-heading span { color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
  .summary-month-counters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
  .summary-month-counters article { min-width: 0; display: grid; justify-items: center; align-content: center; gap: 1px; min-height: 48px; padding: 1px 7px; text-align: center; }
  .summary-month-counters article + article { border-left: 1px solid var(--border); }
  .summary-month-counters strong { font-size: 20px; font-variant-numeric: tabular-nums; }
  .mobile-operations-summary .summary-next-date { overflow: hidden; text-overflow: ellipsis; font-size: 13px; line-height: 24px; white-space: nowrap; }
  .summary-month-counters small { max-width: 100%; color: var(--muted); font-size: 7px; line-height: 1.25; }
  .summary-next-service small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .history-summary { margin-bottom: 9px; font-size: 10px; }
  #historyList { gap: 8px; }
  #historyList .duty-card.completed { grid-template-columns: 52px minmax(0,1fr) auto; grid-template-rows: auto; align-items: center; gap: 8px 10px; padding: 9px 10px; border-left-width: 2px; border-radius: 12px; background: rgba(16,33,46,.6); }
  #historyList .duty-card.completed .duty-date { grid-row: auto; min-height: 52px; padding: 5px 4px; }
  #historyList .duty-date strong { font-size: 19px; }
  #historyList .duty-main { gap: 4px; }
  #historyList .duty-main h3 { font-size: 14px; white-space: normal; }
  #historyList .duty-main .status-chip.approved { display: none; }
  #historyList .duty-meta { font-size: 10px; }
  #historyList .completed-service-meta { display: grid; justify-items: start; gap: 4px; }
  #historyList .completed-service-kind { min-height: 20px; padding: 2px 6px; font-size: 10px; }
  #historyList .completed-service-days { font-size: 11px; line-height: 1.3; }
  #historyList .duty-card.completed .duty-actions { grid-column: 3; grid-row: 1; justify-content: flex-start; padding: 0; }
  #historyList .duty-card.completed .duty-actions .button { width: auto; min-height: 40px; padding: 5px 8px; border-color: transparent; background: transparent; color: var(--teal); }

  #view-changes .toolbar { margin-bottom: 13px; }
  #view-changes .change-tabs { width: 100%; padding: 3px; border-radius: 11px; }
  #view-changes .change-tabs button { flex: 1 1 50%; min-height: 42px; }
  .personal-change-group-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 2px; color: var(--text-soft); font-size: 12px; }
  .personal-change-group-title span { min-width: 21px; height: 21px; display: grid; place-items: center; border-radius: 99px; background: rgba(255,255,255,.055); color: var(--muted); font-size: 9px; }
  .personal-change-group.response .personal-change-group-title { color: #f6d493; }
  .change-card { gap: 10px; padding: 12px; border-radius: 12px; background: rgba(16,33,46,.62); }
  .change-main { gap: 7px; }
  .change-top { gap: 5px; }
  .change-requested { width: 100%; color: var(--muted); font-size: 9px; }
  .change-detail strong { font-size: 14px; }
  .change-route { gap: 5px; color: var(--text-soft); font-size: 10px; }
  .change-facts { display: grid; padding-top: 7px; border-top: 1px solid var(--border); }
  .change-facts > div { grid-template-columns: 64px minmax(0,1fr); }
  .change-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
  .change-actions .button { width: 100%; min-height: 44px; }
  .change-actions .button:last-child:nth-child(odd) { grid-column: 1 / -1; }

  .schedule-header { display: grid; gap: 10px; margin-bottom: 11px; }
  .schedule-heading .eyebrow, .schedule-heading p { display: none; }
  .schedule-heading h2 { margin: 0; font-size: 24px; }
  .schedule-view-switcher { width: 100%; padding: 3px; border-radius: 11px; }
  .schedule-view-switcher button { min-height: 44px; }
  .schedule-period-bar { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px auto; gap: 5px; min-height: 52px; margin-bottom: 10px; padding: 4px 5px; }
  .schedule-period-actions { display: contents; }
  #calendarPrev { grid-column: 1; grid-row: 1; }
  #calendarPeriod { grid-column: 2; grid-row: 1; align-self: center; font-size: 12px; text-align: center; }
  #calendarNext { grid-column: 3; grid-row: 1; }
  #calendarToday { grid-column: 4; grid-row: 1; min-width: 48px; min-height: 44px; padding-inline: 8px; }
  .calendar-mobile { gap: 8px; }
  .calendar-mobile-month { gap: 3px; padding: 6px; border-radius: 12px; }
  .calendar-mobile-month-day { min-height: 53px; border-radius: 7px; }
  .calendar-mobile-month-dots i.service-type-1 { background: #43d6c5; }
  .calendar-mobile-month-dots i.service-type-2 { background: #56c8f2; }
  .calendar-mobile-month-dots i.service-type-3 { background: #e2b95f; }
  .calendar-mobile-month-dots i.service-type-4 { background: #b5a0f5; }
  .calendar-mobile-month-dots i.service-type-5 { background: #60d394; }
  .calendar-mobile .schedule-assignment { min-height: 48px; }
  .calendar-mobile .schedule-assignment::before { background: var(--service-accent); }
  .calendar-mobile .schedule-assignment-origin { color: #78909e; font-size: 8px; }
  .calendar-mobile-month-detail { scroll-margin-bottom: calc(var(--mobile-nav-height) + 14px); }
  .calendar-mobile-month-detail h3:focus { outline: 2px solid rgba(67,214,197,.4); outline-offset: 3px; }
  .calendar-legend { gap: 6px 10px; padding: 4px 1px; font-size: 8px; }
  .calendar-legend .legend-service-type { display: inline-flex; color: var(--text-soft); font-weight: 760; }

  .account-view { width: 100%; }
  .account-view-head { margin-bottom: 12px; }
  .account-hero { grid-template-columns: 58px minmax(0,1fr); gap: 12px; padding: 15px; border-radius: 15px; }
  .account-avatar { width: 58px; height: 58px; font-size: 16px; }
  .account-hero strong { font-size: 17px; }
  .account-section { padding: 14px; border-radius: 13px; }
  .account-data-list { grid-template-columns: 1fr; }
  .account-data-list > div:nth-child(odd), .account-data-list > div:nth-child(even) { padding: 10px 0; border-left: 0; }
  .account-data-list > div:first-child { margin-top: 4px; }
  .account-security { padding-bottom: 8px; }
}

@media (max-width: 340px) {
  .management-action-row.incident .management-action-actions { grid-template-columns: 1fr; }
  #historyList .duty-card.completed { grid-template-columns: 50px minmax(0,1fr); grid-template-rows: auto auto; align-items: start; }
  #historyList .duty-card.completed .duty-date { grid-row: 1 / 3; min-height: 50px; }
  #historyList .duty-card.completed .duty-actions { grid-column: 2; grid-row: 2; margin-top: -2px; }
  #historyList .duty-card.completed .duty-actions .button { min-height: 38px; padding-left: 0; }
  .menu-button.management-mode { min-width: 76px; gap: 4px; padding-inline: 8px; }
  .mobile-management-label { font-size: 9px; }
  .mobile-brand-home { min-width: 37px; grid-template-columns: 25px; padding-inline: 6px; }
  .mobile-brand-home span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .topbar-actions { grid-template-columns: 40px minmax(0,108px); }
  .mobile-bottom-nav button { font-size: 8px; }
  #view-mine .service-row { grid-template-columns: 62px minmax(0,1fr); padding: 10px; gap-inline: 9px; }
  .mobile-week-action { display: none; }
  .mobile-mine-attention { grid-template-columns: 34px minmax(0,1fr); }
  .mobile-mine-attention .button { grid-column: 2; justify-self: start; min-height: 32px; padding: 2px 0; }
  .summary-month-counters { grid-template-columns: repeat(2,minmax(0,1fr)); row-gap: 7px; }
  .summary-month-counters article:nth-child(3) { border-left: 0; }
  .summary-month-counters article:nth-child(n+3) { padding-top: 7px; border-top: 1px solid var(--border); }
}

.desktop-account-nav { display: none !important; }
.desktop-services-list-head,
.desktop-service-icon,
.desktop-service-state { display: none; }

/* Desktop workspace redesign: start */
@media (min-width: 1025px) {
  :root {
    --sidebar-width: 236px;
    --content-max: 1320px;
    --desktop-line: rgba(196,216,229,.12);
    --desktop-line-strong: rgba(196,216,229,.19);
    --desktop-surface: rgba(14,31,43,.82);
    --desktop-surface-raised: rgba(17,37,50,.9);
    --desktop-shadow: 0 18px 46px rgba(0,0,0,.18);
    --desktop-shadow-soft: 0 10px 28px rgba(0,0,0,.12);
  }

  body {
    font-family: "Segoe UI Variable","Segoe UI",system-ui,-apple-system,sans-serif;
    background:
      radial-gradient(circle at 86% -10%,rgba(67,214,197,.07),transparent 34rem),
      radial-gradient(circle at 16% 116%,rgba(86,200,242,.035),transparent 30rem),
      linear-gradient(145deg,#07131d 0%,#050d14 100%);
  }

  .auth-shell {
    position: relative;
    isolation: isolate;
    padding: 48px;
    overflow: hidden;
    background:
      radial-gradient(circle at 18% 10%,rgba(86,200,242,.09),transparent 31rem),
      radial-gradient(circle at 82% 92%,rgba(67,214,197,.075),transparent 34rem),
      linear-gradient(145deg,#07131d,#050c13);
  }
  .auth-shell::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: .16;
    background-image:
      linear-gradient(rgba(196,216,229,.055) 1px,transparent 1px),
      linear-gradient(90deg,rgba(196,216,229,.055) 1px,transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(135deg,black,transparent 72%);
  }
  .auth-card {
    position: relative;
    width: min(470px,100%);
    gap: 27px;
    padding: 42px 44px 34px;
    overflow: hidden;
    border-color: rgba(196,216,229,.18);
    border-radius: 18px;
    background: linear-gradient(150deg,rgba(18,39,53,.96),rgba(10,25,36,.97));
    box-shadow: 0 30px 80px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.025);
  }
  .auth-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg,var(--teal),rgba(86,200,242,.72),transparent 84%);
  }
  #passwordView .auth-card { width: min(680px,100%); }
  .auth-brand { gap: 20px; padding-bottom: 23px; border-bottom: 1px solid rgba(196,216,229,.1); }
  .auth-emblem { width: 72px; height: 86px; }
  .auth-brand h1 { font-size: 35px; letter-spacing: .065em; }
  .auth-brand .auth-product { font-size: 13px; letter-spacing: .14em; }
  .auth-card .form-stack { gap: 18px; }
  .auth-card .form-stack > label { color: #b8c8d1; font-size: 11px; letter-spacing: .045em; }
  .auth-card input { border-color: rgba(196,216,229,.2); background: rgba(5,17,26,.68); }
  .auth-card input:hover { border-color: rgba(196,216,229,.3); }
  .auth-card input:focus { border-color: var(--teal); background: rgba(7,22,32,.9); }
  .auth-card .button.primary { min-height: 46px; }
  .auth-card .auth-foot { color: #7f95a2; }
  .auth-card .auth-version { color: #617987; }

  .sidebar {
    padding: 0 13px 13px;
    border-right-color: rgba(196,216,229,.115);
    background:
      linear-gradient(180deg,rgba(15,32,44,.98) 0%,rgba(8,21,31,.99) 58%,rgba(7,18,27,.99) 100%);
    box-shadow: 12px 0 38px rgba(0,0,0,.15);
  }
  .sidebar-header { min-height: 60px; padding: 0 2px; border-bottom-color: rgba(196,216,229,.1); }
  .brand-lockup { min-height: 52px; padding: 0 8px; border-radius: 9px; transition: transform .16s ease,background .16s ease,border-color .16s ease; }
  .brand-lockup:hover { transform: translateX(1px); border-color: rgba(196,216,229,.1); background: rgba(255,255,255,.025); }
  .brand-emblem { width: 36px; height: 42px; }
  .brand-lockup strong { font-size: 16px; letter-spacing: .085em; }
  .brand-lockup span { color: #8297a3; font-size: 9px; }
  .main-nav { gap: 0; margin-top: 12px; padding-right: 2px; scrollbar-color: rgba(129,152,167,.22) transparent; scrollbar-width: thin; }
  .main-nav::-webkit-scrollbar { width: 4px; }
  .main-nav::-webkit-scrollbar-thumb { border-radius: 99px; background: rgba(129,152,167,.22); }
  .main-nav::-webkit-scrollbar-track { background: transparent; }
  .nav-group { gap: 2px; }
  .nav-group.personal::before {
    content: "Usuario";
    margin: 6px 10px 5px;
    color: #748c99;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
  }
  .nav-group.management { margin-top: 13px; padding-top: 13px; border-top-color: rgba(196,216,229,.1); }
  .nav-section-label { margin: 0 10px 5px; color: #748c99; font-size: 10px; letter-spacing: .15em; }
  .main-nav button {
    min-height: 42px;
    grid-template-columns: 21px minmax(0,1fr) auto;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 9px;
    color: #94a9b5;
    font-size: 13px;
    transition: color .16s ease,background .16s ease,border-color .16s ease,transform .16s ease;
  }
  .main-nav button:hover { transform: translateX(1px); background: rgba(255,255,255,.04); color: #dce9ef; }
  .main-nav button.active {
    border-color: rgba(67,214,197,.18);
    background: linear-gradient(90deg,rgba(67,214,197,.14),rgba(67,214,197,.04));
    color: #ecfffc;
    box-shadow: inset 3px 0 var(--teal),0 7px 18px rgba(0,0,0,.08);
  }
  .main-nav button.active .nav-icon { color: var(--teal); }
  .main-nav button:focus-visible,
  .brand-lockup:focus-visible,
  .topbar button:focus-visible,
  .topbar summary:focus-visible {
    outline: 2px solid rgba(94,231,215,.72);
    outline-offset: 2px;
  }
  .desktop-account-nav { display: grid !important; }
  .nav-badge { min-width: 19px; height: 19px; font-size: 9px; }
  .sidebar-foot { padding: 11px 10px 0; border-top-color: rgba(196,216,229,.1); }
  .sidebar-foot .live-dot { background: #7e95a2; box-shadow: 0 0 0 4px rgba(126,149,162,.08); }

  .topbar {
    min-height: 60px;
    padding: 6px max(34px,calc((100vw - var(--sidebar-width) - var(--content-max))/2 + 38px));
    border-bottom-color: rgba(196,216,229,.12);
    background: rgba(6,16,24,.9);
    box-shadow: 0 8px 30px rgba(0,0,0,.1);
  }
  .page-identity h1 { color: #e9f2f6; font-size: 18px; font-weight: 720; letter-spacing: -.012em; }
  .topbar-actions { gap: 10px; }
  .desktop-notifications-trigger {
    position: relative;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255,255,255,.028);
    color: var(--text-soft);
  }
  .desktop-notifications-trigger:hover,
  .desktop-notifications-trigger:focus-visible { border-color: rgba(67,214,197,.3); background: rgba(67,214,197,.06); color: var(--text); }
  .desktop-notifications-trigger .ui-icon { width: 20px; height: 20px; }
  .desktop-notifications-trigger .mobile-alerts-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    padding: 0 4px;
    border: 2px solid #07131d;
    border-radius: 99px;
    background: var(--amber);
    color: #241904;
    font-size: 8px;
    font-weight: 950;
  }
  .user-menu summary {
    width: min(218px,22vw);
    height: 42px;
    grid-template-columns: 32px minmax(0,1fr) 14px;
    padding-right: 9px;
    border-radius: 10px;
    border-color: rgba(67,214,197,.17);
    background: linear-gradient(135deg,rgba(67,214,197,.075),rgba(16,33,46,.82) 62%,rgba(86,200,242,.035));
  }
  .user-menu summary .avatar { width: 32px; height: 32px; }
  .user-menu summary::after {
    content: "";
    width: 7px;
    height: 7px;
    justify-self: center;
    border-right: 1.5px solid #8299a6;
    border-bottom: 1.5px solid #8299a6;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .16s ease;
  }
  .user-menu[open] summary::after { transform: rotate(225deg) translate(-1px,-1px); }
  .user-menu-panel { top: 48px; border-color: var(--desktop-line-strong); background: rgba(13,30,42,.98); box-shadow: var(--desktop-shadow); }
  .content { padding: 28px 38px 54px; }
  .view-head { align-items: center; margin-bottom: 22px; padding-bottom: 17px; border-bottom: 1px solid var(--desktop-line); }
  .view-head h2 { margin: 3px 0 5px; font-size: 26px; }
  .view-head p { color: #9fb1bc; font-size: 13px; }
  .panel {
    border-color: var(--desktop-line);
    border-radius: 14px;
    background: linear-gradient(145deg,rgba(17,36,49,.82),rgba(11,27,38,.76));
    box-shadow: var(--desktop-shadow-soft);
    backdrop-filter: blur(14px);
  }
  .panel-head { margin-bottom: 16px; }
  .dashboard-grid { gap: 18px; }

  #view-mine { width: min(1140px,100%); }
  #view-mine .personal-heading {
    width: 100%;
    align-items: flex-end;
    margin-bottom: 25px;
    padding: 4px 1px 17px;
    border-bottom: 1px solid var(--desktop-line);
  }
  #view-mine .personal-heading h2 { font-size: 30px; font-weight: 720; letter-spacing: -.03em; }
  #view-mine .personal-date { color: #91a6b2; font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
  #view-mine .services-column { width: 100%; }
  #view-mine .services-overview { padding: 0; border: 0; background: transparent; box-shadow: none; }
  #view-mine .services-panel-head { margin-bottom: 12px; padding: 0 1px 10px; border-bottom: 0; }
  #view-mine .services-panel-head h3 {
    color: #91a7b3;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .15em;
    text-transform: uppercase;
  }
  #view-mine .personal-services-list { display: grid; gap: 0; }
  #view-mine .desktop-services-list-head {
    display: grid;
    grid-template-columns: minmax(118px,145px) minmax(160px,1fr) minmax(145px,180px) minmax(180px,260px);
    gap: 15px;
    margin-top: 21px;
    padding: 0 16px 9px 18px;
    color: #6f8794;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  #view-mine .desktop-services-list-head span:last-child { text-align: right; }
  #view-mine .service-row {
    --service-accent: var(--teal);
    position: relative;
    overflow: hidden;
    min-height: 72px;
    grid-template-columns: minmax(118px,145px) minmax(160px,1fr) minmax(145px,180px) minmax(180px,260px);
    gap: 15px;
    padding: 12px 16px 12px 18px;
    border: 1px solid var(--desktop-line);
    border-bottom: 0;
    border-radius: 0;
    background: rgba(13,30,42,.68);
    box-shadow: none;
    transition: border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease;
  }
  #view-mine .service-row::after {
    content: "";
    position: absolute;
    inset: 12px auto 12px 0;
    width: 2px;
    border-radius: 0 99px 99px 0;
    background: var(--service-accent);
    opacity: .82;
  }
  #view-mine .service-row.service-type-1 { --service-accent: #43d6c5; }
  #view-mine .service-row.service-type-2 { --service-accent: #56c8f2; }
  #view-mine .service-row.service-type-3 { --service-accent: #e2b95f; }
  #view-mine .service-row.service-type-4 { --service-accent: #b5a0f5; }
  #view-mine .service-row.service-type-5 { --service-accent: #60d394; }
  #view-mine .desktop-services-list-head + .service-row { border-radius: 12px 12px 0 0; }
  #view-mine .service-row:last-child { border-bottom: 1px solid var(--desktop-line); border-radius: 0 0 12px 12px; }
  #view-mine .service-row.is-next:last-child { border-radius: 16px; }
  #view-mine .service-row:not(.is-next):hover {
    z-index: 1;
    transform: translateX(2px);
    border-color: var(--desktop-line-strong);
    background: rgba(19,40,53,.88);
    box-shadow: 0 10px 26px rgba(0,0,0,.11);
  }
  #view-mine .service-row.is-next {
    min-height: 142px;
    grid-template-columns: 52px minmax(132px,166px) minmax(0,1fr) minmax(150px,190px);
    grid-template-rows: auto auto;
    align-items: center;
    gap: 10px 19px;
    margin-bottom: 0;
    padding: 21px 24px;
    border-color: rgba(67,214,197,.34);
    border-bottom: 1px solid rgba(67,214,197,.34);
    border-radius: 16px;
    background:
      radial-gradient(circle at 88% 14%,rgba(86,200,242,.105),transparent 18rem),
      linear-gradient(135deg,rgba(67,214,197,.135),rgba(16,36,49,.96) 47%,rgba(9,24,34,.97));
    box-shadow: inset 3px 0 var(--teal),0 20px 46px rgba(0,0,0,.18);
  }
  #view-mine .service-row.is-next::after { inset-block: 15px; opacity: 1; }
  #view-mine .desktop-service-icon { display: none; }
  #view-mine .service-row.is-next .desktop-service-icon {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(67,214,197,.23);
    border-radius: 14px;
    background: rgba(67,214,197,.1);
    color: #79e9dc;
    box-shadow: inset 0 1px rgba(255,255,255,.035);
  }
  #view-mine .service-row.is-next .desktop-service-icon .ui-icon { width: 24px; height: 24px; }
  #view-mine .service-row.is-next .service-row-date { grid-column: 2; grid-row: 1 / 3; align-content: center; gap: 9px; color: var(--text); }
  #view-mine .service-row.is-next .next-service-chip {
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border: 1px solid rgba(67,214,197,.26);
    border-radius: 99px;
    background: rgba(67,214,197,.1);
    color: #9af1e7;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  #view-mine .service-row.is-next .service-row-date strong { max-width: 170px; font-size: 19px; line-height: 1.34; }
  #view-mine .service-row.is-next .service-row-main { grid-column: 3; align-self: end; }
  #view-mine .service-row.is-next .service-row-main > strong { font-size: 21px; letter-spacing: -.02em; }
  #view-mine .service-row-main { gap: 6px; }
  #view-mine .service-row-main > strong { font-size: 14px; }
  #view-mine .service-origin { display: none; }
  #view-mine .desktop-service-state {
    min-width: 0;
    display: grid;
    justify-items: start;
    align-content: center;
    gap: 4px;
    color: #b9c8d0;
  }
  #view-mine .desktop-service-state small {
    min-width: 28px;
    min-height: 20px;
    display: inline-grid;
    place-items: center;
    padding: 2px 7px;
    border: 1px solid rgba(86,200,242,.22);
    border-radius: 99px;
    background: rgba(86,200,242,.07);
    color: #aee4f6;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .06em;
  }
  #view-mine .desktop-service-state > strong { overflow: visible; color: inherit; font-size: 11px; line-height: 1.35; white-space: normal; }
  #view-mine .desktop-service-state.pending { color: #f3ce85; }
  #view-mine .desktop-service-state.changed { color: #d6cafd; }
  #view-mine .desktop-service-state.recovery { color: #b8ebcd; }
  #view-mine .desktop-service-state.return { color: #f2cf8d; }
  #view-mine .service-row.is-next .desktop-service-state { grid-column: 4; align-self: end; }
  #view-mine .service-row.is-next .desktop-service-state > strong { font-size: 12px; }
  #view-mine .own-service-change { display: grid; max-width: 540px; margin-top: 0; }
  #view-mine .own-service-change > strong { display: none; }
  #view-mine .own-service-change > small { color: #aebbc3; line-height: 1.4; }
  #view-mine .service-row-actions { min-width: 0; gap: 6px; }
  #view-mine .service-row:not(.is-next) .service-row-actions { max-width: 260px; }
  #view-mine .service-row.is-next .service-row-actions { grid-column: 3 / 5; grid-row: 2; align-self: start; justify-content: flex-start; }
  #view-mine .service-row-actions .button { min-height: 38px; transition: border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease; }
  #view-mine .service-row:not(.is-next) .service-row-actions .button { min-height: 34px; }
  #view-mine .service-row-actions [data-service-details] { padding-inline: 10px; color: #a9e9df; }
  #view-mine .service-row-actions [data-service-details]:hover { background: rgba(67,214,197,.07); color: #d8fff9; }
  #view-mine .service-row-actions .button:hover { transform: translateY(-1px); }
  #view-mine .service-row.is-next .service-row-actions [data-request-change] {
    border-color: rgba(104,236,220,.66);
    background: linear-gradient(180deg,#45d7c7,#25ad9f);
    color: #041c1a;
    box-shadow: 0 10px 24px rgba(34,169,155,.17);
  }
  #view-mine .service-row.is-next .service-row-actions [data-request-change]:hover { background: linear-gradient(180deg,#59e1d2,#2bb9aa); }

  #view-history,
  #view-changes,
  #view-management { width: min(1060px,100%); }
  #view-history .history-summary {
    width: fit-content;
    margin: -10px 0 18px;
    padding: 6px 10px;
    border: 1px solid var(--desktop-line);
    border-radius: 99px;
    background: rgba(255,255,255,.03);
    color: #91a7b4;
    font-size: 10px;
  }
  #historyList { position: relative; gap: 9px; padding-left: 28px; }
  #historyList::before {
    content: "";
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 8px;
    width: 1px;
    background: linear-gradient(180deg,rgba(67,214,197,.5),rgba(196,216,229,.1));
  }
  #historyList .duty-card.completed {
    --history-accent: var(--teal);
    position: relative;
    min-height: 70px;
    padding: 10px 14px;
    border-color: var(--desktop-line);
    border-radius: 12px;
    background: linear-gradient(145deg,rgba(16,34,47,.74),rgba(11,27,38,.68));
    box-shadow: 0 8px 22px rgba(0,0,0,.07);
    transition: transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
  }
  #historyList .duty-card.completed::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -25px;
    width: 9px;
    height: 9px;
    border: 2px solid #07131d;
    border-radius: 50%;
    background: var(--history-accent);
    box-shadow: 0 0 0 3px rgba(67,214,197,.1);
    transform: translateY(-50%);
  }
  #historyList .duty-card.completed.service-type-1 { --history-accent: #43d6c5; }
  #historyList .duty-card.completed.service-type-2 { --history-accent: #56c8f2; }
  #historyList .duty-card.completed.service-type-3 { --history-accent: #e2b95f; }
  #historyList .duty-card.completed.service-type-4 { --history-accent: #b5a0f5; }
  #historyList .duty-card.completed.service-type-5 { --history-accent: #60d394; }
  #historyList .duty-card.completed:hover {
    transform: translateX(2px);
    border-color: var(--desktop-line-strong);
    background: linear-gradient(145deg,rgba(20,42,56,.88),rgba(13,31,43,.84));
    box-shadow: 0 12px 28px rgba(0,0,0,.12);
  }
  #historyList .duty-card.completed .duty-date { min-height: 48px; }
  #historyList .duty-card.completed .status-chip.approved { display: inline-flex; }
  #historyList .duty-card.completed .duty-actions .button { color: #9ce9df; }

  #view-changes .toolbar { margin: -7px 0 20px; }
  #view-changes .change-tabs { padding: 3px; border: 1px solid var(--desktop-line); border-radius: 10px; background: rgba(7,20,29,.68); box-shadow: inset 0 1px rgba(255,255,255,.015); }
  #view-changes .change-tabs button { min-width: 120px; min-height: 38px; }
  #view-changes .change-tabs button.active { border-color: rgba(67,214,197,.26); box-shadow: 0 7px 18px rgba(0,0,0,.11); }
  #view-changes .personal-change-group { gap: 9px; }
  #view-changes .personal-change-group + .personal-change-group { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--desktop-line); }
  #view-changes .personal-change-group-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 2px; color: var(--text-soft); font-size: 12px; }
  #view-changes .personal-change-group-title span { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 99px; background: rgba(255,255,255,.055); color: var(--muted); font-size: 9px; }
  #view-changes .personal-change-group.response .personal-change-group-title { color: #f3d18d; }
  #view-changes .personal-change-group > div { gap: 10px; }
  #view-changes .change-card {
    position: relative;
    min-height: 104px;
    padding: 16px 18px 16px 20px;
    overflow: hidden;
    border-color: var(--desktop-line);
    border-left-width: 1px;
    border-radius: 12px;
    background: linear-gradient(145deg,rgba(16,34,47,.76),rgba(11,27,38,.7));
    box-shadow: 0 8px 22px rgba(0,0,0,.07);
    transition: transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
  }
  #view-changes .change-card::before {
    content: "";
    position: absolute;
    inset: 12px auto 12px 0;
    width: 3px;
    border-radius: 0 99px 99px 0;
    background: #7f97a4;
  }
  #view-changes .change-card.pending::before { background: var(--amber); }
  #view-changes .change-card.approved::before { background: var(--green); }
  #view-changes .change-card.rejected::before { background: var(--red); }
  #view-changes .change-card:hover {
    transform: translateY(-2px);
    border-color: var(--desktop-line-strong);
    background: linear-gradient(145deg,rgba(20,42,56,.9),rgba(13,31,43,.86));
    box-shadow: 0 13px 30px rgba(0,0,0,.13);
  }
  #view-changes .change-main { gap: 8px; }
  #view-changes .change-top { gap: 7px; }
  #view-changes .change-route { gap: 9px; font-size: 13px; }
  #view-changes .change-route .arrow { color: #72ddcf; }
  #view-changes .change-date-chip {
    min-height: 23px;
    padding: 3px 8px;
    border: 1px solid rgba(86,200,242,.15);
    border-radius: 99px;
    background: rgba(86,200,242,.075);
    color: #addff0;
    font-size: 9px;
    font-weight: 800;
  }
  #view-changes .change-requested { color: #8299a6; font-variant-numeric: tabular-nums; }
  #view-changes .change-actions { min-width: 118px; gap: 7px; }
  #view-changes .change-actions .button { min-height: 37px; }
  #view-changes .empty-state { min-height: 94px; padding: 18px 20px; border: 1px dashed var(--desktop-line); border-radius: 12px; background: rgba(13,29,40,.4); }

  #view-calendar { width: 100%; }
  #view-calendar .schedule-header { align-items: center; margin-bottom: 15px; padding-bottom: 17px; border-bottom: 1px solid var(--desktop-line); }
  #view-calendar .schedule-heading h2 { font-size: 28px; }
  #view-calendar .schedule-heading p { color: #96aab5; font-size: 12px; }
  #view-calendar .schedule-view-switcher { border-color: var(--desktop-line); border-radius: 10px; background: rgba(7,20,29,.7); box-shadow: inset 0 1px rgba(255,255,255,.015); }
  #view-calendar .schedule-view-switcher button { min-width: 84px; min-height: 38px; }
  #view-calendar .schedule-view-switcher button.active { border-color: rgba(67,214,197,.24); background: rgba(25,49,63,.9); box-shadow: 0 7px 18px rgba(0,0,0,.1); }
  #view-calendar .schedule-period-bar {
    margin-bottom: 12px;
    padding: 9px 11px;
    border-color: var(--desktop-line);
    border-radius: 11px;
    background: linear-gradient(90deg,rgba(13,31,43,.72),rgba(9,24,34,.54));
    box-shadow: 0 7px 20px rgba(0,0,0,.06);
  }
  #view-calendar .schedule-period { font-size: 14px; }
  #view-calendar .schedule-incidents { margin-bottom: 12px; }
  #view-calendar .schedule-desktop,
  #view-calendar .schedule-pane,
  #view-calendar .schedule-week-shell,
  #view-calendar .calendar-scroll { width: 100%; min-width: 0; }
  #view-calendar .schedule-week-shell,
  #view-calendar .calendar-scroll { border-color: var(--desktop-line); border-radius: 13px; background: rgba(8,22,32,.72); box-shadow: var(--desktop-shadow-soft); }
  #view-calendar .schedule-week-table { width: 100%; min-width: 0; }
  #view-calendar .calendar-grid { width: 100%; min-width: 0; }
  #view-calendar .schedule-week-table thead th { height: 54px; background: rgba(9,25,35,.98); }
  #view-calendar .schedule-week-table thead th:first-child,
  #view-calendar .schedule-week-table tbody > tr > th { width: clamp(108px,10vw,132px); }
  #view-calendar .schedule-week-table tbody > tr > th { padding: 11px 9px; background: rgba(11,31,42,.98); }
  #view-calendar .schedule-week-table td { padding: 6px; transition: background .14s ease; }
  #view-calendar .schedule-week-table td:hover { background: rgba(67,214,197,.025); }
  #view-calendar .schedule-desktop .schedule-assignment { border-radius: 8px; box-shadow: 0 5px 14px rgba(0,0,0,.09); transition: border-color .14s ease,background .14s ease,transform .14s ease,box-shadow .14s ease; }
  #view-calendar .schedule-desktop .schedule-assignment:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(0,0,0,.13); }
  #view-calendar .calendar-head { min-height: 40px; background: rgba(9,25,35,.96); }
  #view-calendar .calendar-day { min-width: 0; min-height: 150px; padding: 7px; }
  #view-calendar .calendar-legend { margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--desktop-line); }

  #view-management .management-action-list { gap: 10px; }
  #view-management .management-action-row { border-radius: 11px; box-shadow: 0 8px 22px rgba(0,0,0,.08); }
  #view-management .management-action-row.incident { background: linear-gradient(145deg,rgba(241,123,123,.03),rgba(14,31,43,.84)); }
  #view-personnel .personnel-panel > .panel-head { padding: 12px 14px; }
  #view-personnel .personnel-panel > .panel-head > div { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 2px 14px; }
  #view-personnel .personnel-panel > .panel-head .eyebrow, #view-personnel .personnel-panel > .panel-head h3 { grid-column: 1; }
  #view-personnel .personnel-panel > .panel-head h3 { margin: 0; font-size: 16px; }
  #view-personnel .personnel-panel > .panel-head .panel-meta { grid-column: 2; grid-row: 1 / span 2; margin: 0; padding: 5px 9px; border: 1px solid var(--border); border-radius: 99px; background: rgba(255,255,255,.025); font-size: 10px; }
  #view-personnel .personnel-list-head { display: grid; grid-template-columns: minmax(200px,1.2fr) minmax(190px,.95fr) max-content; gap: 12px; padding: 8px 12px 8px 15px; border-bottom: 1px solid var(--border); background: rgba(5,16,24,.3); color: #708996; font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
  #view-personnel .personnel-list-head span:last-child { min-width: 228px; text-align: right; }
  #view-personnel .personnel-row { grid-template-columns: minmax(200px,1.2fr) minmax(190px,.95fr) max-content; gap: 12px; min-height: 66px; padding: 9px 12px 9px 15px; transition: background .14s ease,box-shadow .14s ease; }
  #view-personnel .personnel-row::before { inset-block: 10px; }
  #view-personnel .personnel-row:hover { background: rgba(255,255,255,.022); }
  #view-personnel .personnel-row:focus-within { background: rgba(67,214,197,.025); box-shadow: inset 0 0 0 1px rgba(67,214,197,.16); }
  #view-personnel .personnel-identity { grid-template-columns: 38px minmax(0,1fr); gap: 10px; }
  #view-personnel .personnel-identity > .schedule-avatar { width: 38px; height: 38px; font-size: 10px; }
  #view-personnel .personnel-identity-copy { gap: 3px; }
  #view-personnel .personnel-identity strong { font-size: 13px; }
  #view-personnel .personnel-identity small { font-size: 9px; }
  #view-personnel .personnel-state-label { display: none; }
  #view-personnel .personnel-operational-state { gap: 3px; }
  #view-personnel .personnel-operational-copy { flex-wrap: nowrap; gap: 8px; }
  #view-personnel .personnel-operational-detail > strong { font-size: 12px; }
  #view-personnel .personnel-operational-detail > span { font-size: 9px; }
  #view-personnel .personnel-actions { min-width: 228px; flex-wrap: nowrap; }
  #view-personnel .personnel-actions .button { min-height: 36px; white-space: nowrap; }
  .planner-toolbar,
  .management-composer,
  .personnel-panel,
  .import-setup,
  .import-status-panel { border-radius: 12px; }
}

@media (min-width: 1280px) {
  #view-mine .service-row.is-next { grid-template-columns: 52px 166px minmax(190px,1fr) minmax(150px,190px) minmax(180px,auto); grid-template-rows: auto; }
  #view-mine .service-row.is-next .desktop-service-icon,
  #view-mine .service-row.is-next .service-row-date { grid-row: auto; }
  #view-mine .service-row.is-next .service-row-main { grid-column: 3; align-self: center; }
  #view-mine .service-row.is-next .desktop-service-state { grid-column: 4; align-self: center; }
  #view-mine .service-row.is-next .service-row-actions { grid-column: 5; grid-row: auto; align-self: center; justify-content: flex-end; }
}
/* Desktop workspace redesign: end */

@media (min-width: 1025px) and (max-width: 1199px) {
  :root { --sidebar-width: 208px; }
  .sidebar { padding-inline: 10px; }
  .brand-lockup { gap: 8px; padding-inline: 5px; }
  .brand-emblem { width: 32px; height: 38px; }
  .brand-lockup strong { font-size: 14px; }
  .main-nav button { min-height: 40px; gap: 8px; padding-inline: 9px; font-size: 12px; }
  .topbar { padding-inline: 24px; }
  .content { padding: 25px 24px 48px; }
  .user-menu summary { width: 184px; }
  #view-mine .desktop-services-list-head,
  #view-mine .service-row { grid-template-columns: minmax(112px,130px) minmax(150px,1fr) minmax(132px,158px) minmax(176px,210px); gap-inline: 12px; }
  #view-mine .service-row.is-next { grid-template-columns: 48px 126px minmax(0,1fr) minmax(132px,158px); }
  #view-mine .service-row.is-next .desktop-service-icon { width: 48px; height: 48px; }
  #view-calendar .schedule-week-table thead th:first-child,
  #view-calendar .schedule-week-table tbody > tr > th { width: 104px; }
  #view-calendar .schedule-week-table tbody > tr > th { padding-inline: 7px; }
  #view-calendar .schedule-week-table tbody > tr > th strong { font-size: 10px; }
  #view-calendar .schedule-week-table td { padding: 4px; }
  #view-calendar .schedule-week-table .schedule-assignment { gap: 4px; padding: 7px 6px 7px 9px; }
  #view-calendar .schedule-week-table .schedule-person { grid-template-columns: minmax(0,1fr); gap: 3px; }
  #view-calendar .schedule-week-table .schedule-avatar { display: none; }
  #view-calendar .schedule-week-table .schedule-rank { font-size: 8px; }
  #view-calendar .schedule-week-table .schedule-person-copy strong { font-size: 10px; }
  #view-calendar .schedule-week-table .schedule-assignment-service { font-size: 9px; }
  #view-calendar .schedule-week-table .schedule-assignment-origin,
  #view-calendar .schedule-week-table .schedule-assignment-meta { font-size: 8px; }
  #view-calendar .calendar-day { min-height: 138px; padding: 5px; }
}

@media (min-width: 721px) and (max-width: 1024px) {
  #view-calendar .schedule-desktop,
  #view-calendar .schedule-pane,
  #view-calendar .schedule-week-shell,
  #view-calendar .calendar-scroll { width: 100%; max-width: 100%; min-width: 0; }
  #view-calendar .schedule-week-table,
  #view-calendar .calendar-grid { width: 100%; min-width: 0; }
  #view-calendar .schedule-week-table thead th:first-child,
  #view-calendar .schedule-week-table tbody > tr > th { width: 96px; }
  #view-calendar .schedule-week-table tbody > tr > th { padding-inline: 7px; }
  #view-calendar .schedule-week-table tbody > tr > th strong { font-size: 10px; }
  #view-calendar .schedule-week-table td { padding: 4px; }
  #view-calendar .schedule-week-table .schedule-assignment { gap: 4px; padding: 7px 6px 7px 9px; }
  #view-calendar .schedule-week-table .schedule-person { grid-template-columns: minmax(0,1fr); gap: 3px; }
  #view-calendar .schedule-week-table .schedule-avatar { display: none; }
  #view-calendar .schedule-week-table .schedule-rank { font-size: 8px; }
  #view-calendar .schedule-week-table .schedule-person-copy strong { font-size: 10px; }
  #view-calendar .schedule-week-table .schedule-assignment-service { font-size: 9px; }
  #view-calendar .schedule-week-table .schedule-assignment-origin,
  #view-calendar .schedule-week-table .schedule-assignment-meta { font-size: 8px; }
  #view-calendar .schedule-assignment.compact .schedule-person-copy strong { font-size: 10px; }
  #view-calendar .schedule-assignment.compact .schedule-assignment-service { font-size: 9px; }
  #view-calendar .schedule-assignment.compact .schedule-assignment-origin { font-size: 8px; }
  #view-calendar .calendar-day { min-height: 138px; padding: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
