/* STRW-TOOL full visual remake. Loaded last and removable as one layer. */
:root {
  --strw-bg: #031820;
  --strw-bg-deep: #021117;
  --strw-panel: #06232d;
  --strw-panel-2: #092d39;
  --strw-panel-3: #0c3744;
  --strw-line: rgba(148, 184, 196, .22);
  --strw-line-strong: rgba(177, 207, 217, .38);
  --strw-text: #f7fafb;
  --strw-muted: #a9bec6;
  --strw-orange: #ff6900;
  --strw-orange-hover: #ff7d21;
  --strw-green: #32df8b;
  --strw-yellow: #ffd33d;
  --strw-blue: #319cff;
  --strw-red: #ff4d4f;
  --strw-shadow: 0 16px 42px rgba(0, 7, 10, .32);
  --accent: var(--strw-orange);
  --accent-2: var(--strw-orange-hover);
  --accent-soft: rgba(255, 105, 0, .14);
  --focus: rgba(255, 126, 37, .9);
  --bg: var(--strw-bg);
  --bg-2: var(--strw-bg-deep);
  --surface: rgba(6, 35, 45, .96);
  --surface-2: rgba(9, 45, 57, .92);
  --card: rgba(6, 35, 45, .96);
  --text: var(--strw-text);
  --muted: #bfd0d6;
  --muted-2: var(--strw-muted);
  --border: var(--strw-line);
  --border-2: var(--strw-line-strong);
  --active-blue: var(--strw-orange);
  --nav-bg: rgba(2, 24, 32, .98);
  --blur-bg: rgba(3, 24, 32, .99);
  --radius-sm: 8px;
  --radius: 10px;
  --radius-lg: 12px;
  color-scheme: dark;
}

html { background: var(--strw-bg-deep); }
body.strw-remake {
  margin: 0;
  color: var(--strw-text);
  background: var(--strw-bg) !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
}
body.strw-remake #app { min-height: 100dvh; background: var(--strw-bg); }
body.strw-remake .splash-screen { background: var(--strw-bg-deep) !important; }
body.strw-remake .splash-screen img { width: min(330px, 72vw); filter: none; }
body.strw-remake .splash-screen h1 { color: #fff; }
body.strw-remake .splash-screen p { color: var(--strw-orange); }
body.strw-remake #app.ready { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: 72px auto; }
body.strw-remake #mainContent {
  grid-column: 1 / -1;
  width: min(1540px, calc(100% - 32px));
  margin: 0 auto;
  padding: 0 0 28px;
}
body.strw-remake #mainContent.assign-fullscreen { width: min(1600px, calc(100% - 24px)); }

/* App header */
body.strw-remake .top-logo {
  position: sticky;
  top: 0;
  z-index: 10041;
  grid-column: 1;
  grid-row: 1;
  min-width: 250px;
  min-height: 72px;
  justify-content: flex-start;
  padding: 8px 18px !important;
  border: 0;
  border-radius: 0 !important;
  background: var(--nav-bg) !important;
  box-shadow: inset 0 -1px var(--strw-line);
}
body.strw-remake .top-logo img { width: 214px !important; height: 58px; margin: 0 !important; object-fit: contain; }
body.strw-remake .top-logo-text h1 { margin: 0; font-size: 1.18rem !important; line-height: 1; font-weight: 900; letter-spacing: 0; }
body.strw-remake .top-logo-text h1 span { color: var(--strw-orange); }
body.strw-remake .top-logo-text p { margin: 5px 0 0; max-width: 174px; color: var(--strw-muted) !important; font-size: .62rem !important; text-transform: uppercase; white-space: nowrap; }

body.strw-remake #mainNav {
  position: sticky;
  top: 0;
  z-index: 10040;
  grid-column: 2;
  grid-row: 1;
  height: 72px;
  border: 0;
  border-radius: 0 !important;
  background: var(--nav-bg) !important;
  box-shadow: inset 0 -1px var(--strw-line);
}
body.strw-remake #mainNav .nav-container { height: 72px; justify-content: flex-start; padding: 8px 6px; }
body.strw-remake #mainNav .nav-menu { gap: 3px; }
body.strw-remake #mainNav .nav-btn {
  min-height: 56px;
  padding: 8px 14px;
  border: 0;
  border-radius: 6px !important;
  background: transparent;
  color: #dce8ec;
  font-size: .82rem;
  font-weight: 700;
}
body.strw-remake #mainNav .nav-btn:hover { background: rgba(255, 255, 255, .055); }
body.strw-remake #mainNav .nav-btn.active { background: rgba(255, 105, 0, .15); color: #fff; box-shadow: inset 0 -3px var(--strw-orange); }
body.strw-remake #mainNav .nav-btn.active::after { display: none; }
body.strw-remake #mainNav .dropdown {
  top: calc(100% + 1px);
  min-width: 245px;
  padding: 7px;
  border: 1px solid var(--strw-line);
  border-radius: 8px;
  background: #06232d;
  box-shadow: 0 20px 50px rgba(0, 5, 8, .48);
}
body.strw-remake #mainNav .dropdown a { min-height: 42px; display: flex; align-items: center; padding: 9px 11px; border-radius: 6px; color: #d8e7eb; }
body.strw-remake #mainNav .dropdown a:hover,
body.strw-remake #mainNav .dropdown a.active { background: rgba(255, 105, 0, .14); color: #fff !important; box-shadow: inset 3px 0 var(--strw-orange); }

.remake-header-tools {
  position: sticky;
  top: 0;
  z-index: 10042;
  grid-column: 3;
  grid-row: 1;
  height: 72px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 8px 8px;
  background: var(--nav-bg);
  box-shadow: inset 0 -1px var(--strw-line);
}
.remake-search, .remake-head-icon, .remake-profile {
  min-height: 42px;
  border: 1px solid var(--strw-line);
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .045);
  color: var(--strw-text);
}
.remake-search { width: 218px; display: flex; align-items: center; gap: 9px; padding: 0 11px; color: var(--strw-muted); cursor: pointer; }
.remake-search svg { width: 18px; }
.remake-search span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.remake-search kbd { margin-left: auto; border: 0; background: transparent; color: #718e98; font: inherit; font-size: .7rem; }
.remake-head-icon { position: relative; width: 42px; display: grid; place-items: center; cursor: pointer; }
.remake-head-icon b { position: absolute; right: 8px; top: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--strw-orange); box-shadow: 0 0 0 2px var(--strw-bg); }
.remake-profile { display: grid; grid-template-columns: 38px auto 16px; align-items: center; gap: 9px; padding: 3px 8px 3px 4px; cursor: pointer; }
.remake-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #f8fafb; color: #08242d; font-weight: 900; }
.remake-profile-copy { display: grid; min-width: 84px; text-align: left; }
.remake-profile-copy strong { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }
.remake-profile-copy small { color: var(--strw-muted); font-size: .68rem; }
.remake-profile > svg { width: 15px; }

/* Shared operational UI */
body.strw-remake :is(.card, .dcard, .kpi, .wr-card, .an-section, .repWeekBlock, .category-panel, .settings-card, .support-list, .support-detail, .rsa-browser-panel) {
  border-color: var(--strw-line) !important;
  border-radius: 8px !important;
  background: var(--strw-panel) !important;
  box-shadow: none !important;
}
body.strw-remake :is(input, select, textarea, .input, .select, .textarea, .wr-input, .wr-select, .wr-textarea) {
  min-height: 42px;
  border-color: var(--strw-line) !important;
  border-radius: 7px !important;
  background: #071f29 !important;
  color: var(--strw-text) !important;
  box-shadow: none !important;
}
body.strw-remake :is(input, select, textarea):focus { border-color: var(--strw-orange) !important; box-shadow: 0 0 0 3px rgba(255, 105, 0, .13) !important; }
body.strw-remake :is(.btn, .wr-btn, .repTabBtn, .calendar-tab, button) { letter-spacing: 0; }
body.strw-remake :is(.btn, .wr-btn, .repTabBtn, .calendar-tab):not(.danger) {
  border-color: var(--strw-line-strong);
  border-radius: 9px !important;
  background: #0a2a35;
  color: var(--strw-text);
  box-shadow: none;
}
body.strw-remake :is(.btn.primary, .wr-btn-primary, .wr-btn.wr-primary, .repTabBtn.active, button.primary) {
  border-color: var(--strw-orange) !important;
  background: var(--strw-orange) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(255, 105, 0, .2) !important;
}
body.strw-remake :is(.btn.primary, .wr-btn-primary, .wr-btn.wr-primary, .repTabBtn.active, button.primary):hover { background: var(--strw-orange-hover) !important; }
body.strw-remake .muted { color: var(--strw-muted) !important; }
body.strw-remake :is(h1, h2, h3, h4) { letter-spacing: 0; }
body.strw-remake :focus-visible { outline: 3px solid rgba(255, 126, 37, .72) !important; outline-offset: 2px; }

/* Reusable photo heroes */
.remake-page-hero,
body.strw-remake .remake-native-hero {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: 190px;
  margin: 0 0 14px !important;
  padding: 30px 34px !important;
  display: flex !important;
  align-items: flex-end !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden;
  background-color: #061b23 !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: none !important;
}
.remake-page-hero::before,
body.strw-remake .remake-native-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(2, 15, 20, .88) 0%, rgba(2, 15, 20, .45) 44%, rgba(2, 15, 20, .08) 75%);
}
.remake-page-hero > div,
body.strw-remake .remake-native-hero > div { position: relative; z-index: 1; }
.remake-page-hero h1,
body.strw-remake .remake-native-hero h2 { margin: 4px 0 2px !important; color: #fff !important; font-size: clamp(2rem, 3.5vw, 3.15rem) !important; line-height: 1.04; text-shadow: 0 3px 18px rgba(0, 0, 0, .55); }
.remake-page-hero p,
body.strw-remake .remake-native-hero p,
body.strw-remake .remake-native-hero .sub { margin: 6px 0 0 !important; color: #edf5f7 !important; font-size: clamp(.98rem, 1.5vw, 1.18rem) !important; text-shadow: 0 2px 12px rgba(0, 0, 0, .72); }
.remake-hero-kicker,
body.strw-remake .remake-native-hero :is(.repHeroKicker, .an-kicker, .assign-kicker) { color: var(--strw-orange) !important; font-weight: 900; text-transform: uppercase; letter-spacing: 0 !important; }
.remake-hero-dashboard { background-image: url('../assets/design-remake/hero-dashboard.webp') !important; background-position: center 55% !important; }
.remake-hero-office { background-image: url('../assets/design-remake/hero-office.webp') !important; }
.remake-hero-training { background-image: url('../assets/design-remake/hero-training.webp') !important; }
.remake-hero-briefing { background-image: url('../assets/design-remake/hero-briefing.webp') !important; }
.remake-hero-fleet { background-image: url('../assets/design-remake/hero-fleet.webp') !important; }
.remake-hero-login { background-image: url('../assets/design-remake/hero-login.webp') !important; }

/* Dashboard */
body.strw-remake .dash-v11 { width: 100%; max-width: none; padding: 0 0 24px; gap: 12px; }
body.strw-remake .dash-v11 .dash-head { min-height: 320px; padding: 38px !important; }
body.strw-remake .dash-v11 .dash-head h2 { font-size: clamp(2.3rem, 4vw, 4rem) !important; }
body.strw-remake .dash-v11 .dash-head::after { display: none; }
body.strw-remake .dash-v11 .kpi-strip { margin-top: -62px; position: relative; z-index: 2; padding: 0 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
body.strw-remake .dash-v11 .kpi { min-height: 118px; padding: 17px; background: rgba(4, 30, 39, .94) !important; backdrop-filter: blur(14px); box-shadow: var(--strw-shadow) !important; }
body.strw-remake .dash-v11 .k-label { color: var(--strw-orange) !important; text-transform: uppercase; font-size: .7rem !important; }
body.strw-remake .dash-v11 .dash-grid { gap: 12px; padding: 0 18px; }
body.strw-remake .dash-v11 .dcard-head { border-color: var(--strw-line); }
body.strw-remake .dash-v11 .tile { border-radius: 8px !important; background: #082832; }
body.strw-remake .dash-v11 .tile:hover { border-color: var(--strw-orange); background: rgba(255, 105, 0, .09); }
body.strw-remake .dash-v11 .tile .ico { color: var(--strw-orange); background: rgba(255, 105, 0, .12); }

/* Reports and editor */
body.strw-remake .repHero { min-height: 215px; }
body.strw-remake .repHeroMeta { border-color: rgba(255, 255, 255, .34); background: rgba(2, 20, 27, .72); }
body.strw-remake .repTopBar { margin-top: 0; border: 1px solid var(--strw-line); border-radius: 8px; background: var(--strw-panel); }
body.strw-remake .repMonthRow .repTabBtn { border-radius: 6px !important; }
body.strw-remake .repTile { border-radius: 7px !important; background: #082731 !important; }
body.strw-remake .repTile::before { width: 5px; height: auto; inset: 0 auto 0 0; border-radius: 7px 0 0 7px; }
body.strw-remake .repTile.work::before { background: var(--strw-green); }
body.strw-remake .repTile.school::before { background: var(--strw-yellow); }
body.strw-remake .wr-page { width: 100%; max-width: none; padding: 0 0 32px; }
body.strw-remake .wr-page > .wr-top { margin: 0 0 12px; padding: 12px 16px; border-radius: 8px; background: var(--strw-panel); }
body.strw-remake .wr-card { padding: 16px; }
body.strw-remake .wr-card h2 { color: #fff; }
body.strw-remake .wr-card h2 .ui-icon { color: var(--strw-orange); }
body.strw-remake .wr-task { border-radius: 7px; background: #082832; }
body.strw-remake .wr-rsa-picker { border-color: rgba(255, 105, 0, .28); background: rgba(255, 105, 0, .055); }

/* Ausbildungsnachweis, assignment and settings */
body.strw-remake .an-page { width: 100%; max-width: none; }
body.strw-remake .an-hero { min-height: 210px; }
body.strw-remake .an-panel { display: grid; gap: 12px; }
body.strw-remake .an-section { padding: 17px; }
body.strw-remake .an-section > h3 { color: #fff; }
body.strw-remake .an-text-item,
body.strw-remake .an-saved-item { border-radius: 7px; background: #082832; }
body.strw-remake .assign-page { max-width: none; }
body.strw-remake .assign-hero { min-height: 220px; }
body.strw-remake .assign-board-wrap { gap: 10px; }
body.strw-remake :is(.assign-plan-card, .assign-dropzone, .assign-absence-zone, .assign-pool) { border-radius: 7px !important; background: #082832 !important; }
body.strw-remake .assign-head-strecke { color: var(--strw-blue); }
body.strw-remake .assign-head-kolonne { color: var(--strw-green); }
body.strw-remake .assign-head-hof { color: var(--strw-orange); }
body.strw-remake .settings-sidebar button.active,
body.strw-remake .settings-tabs button.active { border-color: var(--strw-orange) !important; background: rgba(255, 105, 0, .14) !important; color: #fff !important; }
body.strw-remake input[type='checkbox'],
body.strw-remake input[type='radio'] { accent-color: var(--strw-orange); }

/* RSA, maps, dialogs */
body.strw-remake .rsa-filter-chip.active,
body.strw-remake .rsa-plan-card.active { border-color: var(--strw-orange) !important; background: rgba(255, 105, 0, .1) !important; }
body.strw-remake :is(.prod-dialog, .wrveh-modal, .wr-geoDialog, .an-photo-editor-dialog, .public-support-card) { border-radius: 10px !important; border-color: var(--strw-line-strong) !important; background: var(--strw-panel) !important; }
body.strw-remake :is(.prod-overlay, .wrveh-overlay, .wr-geoModal, .an-photo-editor-modal) { background: rgba(0, 12, 17, .8) !important; }
body.strw-remake .prod-result-icon { color: var(--strw-orange); background: rgba(255, 105, 0, .13); }
body.strw-remake .prod-toolbtn.primary { border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .prod-toolbtn { background: var(--strw-panel-2); border-color: var(--strw-line-strong); }

/* Login */
body.strw-remake #loginOverlay {
  padding: 28px;
  background: url('../assets/design-remake/hero-login.webp') center / cover no-repeat;
  backdrop-filter: none;
}
body.strw-remake #loginOverlay::before { content: ""; position: absolute; inset: 0; background: rgba(1, 13, 18, .34); }
body.strw-remake .login-card {
  position: relative;
  z-index: 1;
  width: min(470px, 94vw);
  max-height: calc(100dvh - 40px);
  overflow: auto;
  padding: 24px 28px 20px;
  border: 1px solid rgba(207, 225, 231, .28);
  border-radius: 14px;
  background: rgba(3, 24, 32, .9);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .5);
  backdrop-filter: blur(16px);
}
.remake-login-brand { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 18px; }
.remake-login-brand img { width: 248px; height: auto; max-height: 150px; object-fit: contain; }
.remake-login-brand > div { display: grid; }
.remake-login-brand strong { font-size: 1.55rem; line-height: 1; font-weight: 950; }
.remake-login-brand strong span { color: var(--strw-orange); }
.remake-login-brand small { margin-top: 5px; color: var(--strw-muted); font-size: .62rem; text-transform: uppercase; }
.remake-login-welcome { text-align: center; }
.remake-login-welcome h1 { margin: 0; font-size: 1.8rem; }
.remake-login-welcome p { margin: 7px 0 14px !important; }
body.strw-remake .login-tabs { justify-content: center; margin: 8px 0 16px; }
body.strw-remake .login-tabs .btn { flex: 1; background: #092b36; }
body.strw-remake .login-tabs .btn.active { border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .login-field { position: relative; }
body.strw-remake .login-field input,
body.strw-remake .login-field select { min-height: 52px; padding: 12px 44px 12px 14px; }
body.strw-remake .login-actions .btn { width: 100%; min-height: 52px; border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .login-actions,
body.strw-remake .login-actions > div { width: 100%; }
.remake-pass-toggle { position: absolute !important; right: 6px; bottom: 5px; width: 42px; height: 42px; border: 0 !important; background: transparent !important; color: var(--strw-muted) !important; cursor: pointer; }
.remake-pass-toggle svg { width: 19px; }
.public-support-actions { justify-content: center; }
.remake-login-benefits { margin-top: 18px; padding-top: 16px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; border-top: 1px solid var(--strw-line); }
.remake-login-benefits span { display: grid; justify-items: center; gap: 5px; color: var(--strw-muted); font-size: .68rem; text-align: center; }
.remake-login-benefits svg { width: 21px; color: #fff; }

/* Bottom navigation is a phone-only control */
.remake-bottom-nav { display: none; }

/* Tablet */
@media (min-width: 851px) and (max-width: 1260px) {
  body.strw-remake #app.ready { grid-template-columns: 210px minmax(0, 1fr) auto; }
  body.strw-remake .top-logo { min-width: 210px; padding-inline: 12px !important; }
  body.strw-remake .top-logo img { width: 180px !important; }
  body.strw-remake .top-logo-text h1 { font-size: 1rem !important; }
  body.strw-remake .top-logo-text p { display: none; }
  body.strw-remake #mainNav .nav-btn { padding-inline: 9px; font-size: .76rem; }
  .remake-search { width: 44px; padding: 0; justify-content: center; }
  .remake-search span, .remake-search kbd, .remake-profile-copy { display: none; }
  .remake-profile { grid-template-columns: 34px 14px; min-width: 64px; }
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.strw-remake .dash-v11 .dash-assignment-kpi { grid-column: 1 / -1; }
}

/* Phone */
@media (max-width: 850px) {
  body.strw-remake { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  body.strw-remake #app.ready { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 68px auto; }
  body.strw-remake .top-logo { position: sticky; grid-column: 1; min-width: 0; min-height: 68px; height: 68px; padding: 8px 6px 8px 12px !important; }
  body.strw-remake .top-logo img { width: 174px !important; height: 56px; margin: 0 !important; }
  body.strw-remake .top-logo-text h1 { font-size: 1rem !important; }
  body.strw-remake .top-logo-text p { display: none; }
  body.strw-remake #mainNav { position: static; grid-column: auto; width: 0; height: 0; background: transparent !important; box-shadow: none; }
  body.strw-remake #mainNav .nav-container { width: 0; height: 0; padding: 0; }
  body.strw-remake #mobileNavToggle { position: fixed; right: -100px; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  body.strw-remake #navMenu.nav-menu {
    width: min(88vw, 390px);
    padding: calc(70px + env(safe-area-inset-top)) 14px calc(84px + env(safe-area-inset-bottom));
    border-radius: 0;
    background: #041c25;
  }
  body.strw-remake #navMenu .nav-btn { min-height: 48px; margin: 0 0 6px; border: 1px solid var(--strw-line); border-radius: 8px !important; background: #082832; }
  body.strw-remake #navMenu .dropdown { padding: 2px 0 8px 10px; }
  body.strw-remake #navMenu .dropdown a { min-height: 44px; }
  .remake-header-tools { position: sticky; grid-column: 2; height: 68px; padding: 8px 10px 8px 4px; }
  .remake-search, .remake-profile-copy, .remake-profile > svg { display: none; }
  .remake-head-icon { width: 40px; min-height: 40px; border: 0; background: transparent; }
  .remake-profile { display: grid; min-width: 42px; grid-template-columns: 36px; border: 0; background: transparent; padding: 2px; }
  .remake-avatar { width: 36px; height: 36px; }
  body.strw-remake #mainContent,
  body.strw-remake #mainContent.assign-fullscreen { width: 100%; padding-bottom: 18px; }

  .remake-page-hero,
  body.strw-remake .remake-native-hero {
    min-height: 156px;
    padding: 20px 18px !important;
    margin-bottom: 10px !important;
    background-position: center !important;
  }
  .remake-page-hero::before,
  body.strw-remake .remake-native-hero::before { background: rgba(2, 15, 20, .46); }
  .remake-page-hero h1,
  body.strw-remake .remake-native-hero h2 { font-size: 1.85rem !important; }
  .remake-page-hero p,
  body.strw-remake .remake-native-hero p,
  body.strw-remake .remake-native-hero .sub { max-width: 88%; font-size: .94rem !important; }
  body.strw-remake .remake-hero-office { background-position: 60% center !important; }
  body.strw-remake .remake-hero-training { background-position: 48% center !important; }
  body.strw-remake .remake-hero-briefing { background-position: 50% center !important; }
  body.strw-remake .remake-hero-fleet { background-position: 52% center !important; }
  body.strw-remake .remake-hero-dashboard { background-position: 69% center !important; }

  body.strw-remake .dash-v11 { padding: 0 10px 12px; }
  body.strw-remake .dash-v11 .dash-head { min-height: 250px; margin-inline: -10px !important; padding: 24px 18px 68px !important; align-items: flex-end !important; }
  body.strw-remake .dash-v11 .dash-head h2 { font-size: 2.05rem !important; }
  body.strw-remake .dash-v11 .kpi-strip { margin-top: -54px; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  body.strw-remake .dash-v11 .kpi { min-width: 0; min-height: 106px; padding: 12px; }
  body.strw-remake .dash-v11 .kpi.weather { grid-column: auto; }
  body.strw-remake .dash-v11 .dash-assignment-kpi { grid-column: 1 / -1; }
  body.strw-remake .dash-v11 .dash-grid { padding: 0; grid-template-columns: 1fr; }
  body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

  body.strw-remake :is(.repTopBar, .repWeekBlock, .an-panel, .assign-list-card, .wr-page, .category-panel, .support-wrap) { margin-left: 10px !important; margin-right: 10px !important; }
  body.strw-remake .repHero { margin-inline: 0 !important; }
  body.strw-remake .repTopBar { padding: 10px; }
  body.strw-remake .repMonthRow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body.strw-remake .repTilesWrap { grid-template-columns: 1fr !important; gap: 8px !important; }
  body.strw-remake .repTile { min-height: 118px !important; display: grid; grid-template-columns: 70px minmax(0, 1fr); align-content: center; }
  body.strw-remake .wr-page { padding: 0 0 90px !important; }
  body.strw-remake .wr-page > .wr-top { margin-inline: 0; border-radius: 0; }
  body.strw-remake .wr-card { padding: 13px; }
  body.strw-remake .an-panel { display: block; }
  body.strw-remake .an-section { margin-bottom: 10px; padding: 13px; }
  body.strw-remake .assign-hero { margin-inline: -10px !important; }
  body.strw-remake .assign-board-wrap { display: block; overflow-x: auto; }
  body.strw-remake .assign-board { min-width: 720px; }
  body.strw-remake .ui-mobile-report-actions { bottom: calc(78px + env(safe-area-inset-bottom)) !important; border-color: var(--strw-line); border-radius: 10px; background: rgba(4, 29, 38, .97); }

  .remake-bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10020;
    height: calc(68px + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 6px 4px env(safe-area-inset-bottom);
    border-top: 1px solid var(--strw-line);
    background: rgba(2, 24, 32, .98);
    backdrop-filter: blur(18px);
  }
  .remake-bottom-nav button { min-width: 0; display: grid; place-items: center; align-content: center; gap: 3px; border: 0; border-radius: 6px !important; background: transparent; color: #b8cbd1; font-size: .67rem; cursor: pointer; }
  .remake-bottom-nav button svg { width: 21px; height: 21px; }
  .remake-bottom-nav button.active { color: var(--strw-orange); background: rgba(255, 105, 0, .08); }
  .remake-bottom-nav button.active::after { content: ""; position: absolute; bottom: 3px; width: 24px; height: 3px; border-radius: 4px; background: var(--strw-orange); }

  body.strw-remake .prod-toolbox { right: 12px; bottom: calc(82px + env(safe-area-inset-bottom)); }
  body.strw-remake .prod-toolbtn:not(.primary) { display: none; }
  body.strw-remake .prod-toolbtn.primary { width: 52px; height: 52px; }

  body.strw-remake #loginOverlay { padding: 14px; background-position: 68% center; align-items: end; }
  body.strw-remake #loginOverlay::before { background: rgba(1, 13, 18, .42); }
  body.strw-remake .login-card { width: 100%; max-height: 80dvh; padding: 18px 16px 14px; border-radius: 14px; }
  .remake-login-brand { margin-bottom: 10px; }
  .remake-login-brand img { width: 210px; height: auto; }
  .remake-login-brand strong { font-size: 1.22rem; }
  .remake-login-welcome h1 { font-size: 1.45rem; }
  .remake-login-benefits { margin-top: 12px; padding-top: 12px; }
  .remake-login-benefits span { font-size: .6rem; }
}

/* Fleet inventory keeps the existing defect workflow one tab away. */
body.strw-remake .vehicle-page { padding: 14px 22px 28px; }
.vehicle-tabs { display:flex; gap:8px; margin:0 0 14px; border-bottom:1px solid #294550; }
.vehicle-tabs button { border:0; border-bottom:3px solid transparent; background:transparent; color:#b8cbd2; padding:10px 16px; font-weight:600; cursor:pointer; }
.vehicle-tabs button.active { color:#ff822c; border-bottom-color:#ff7000; }
.vehicle-page [data-vehicle-panel][hidden] { display:none !important; }
.fleet-browser { color:#eef5f7; }
.fleet-type-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.fleet-type-tabs button,.fleet-view-modes button { background:#102c38; color:#dce9ed; border:1px solid #294b58; border-radius:5px; min-height:37px; padding:7px 13px; cursor:pointer; }
.fleet-type-tabs button.active,.fleet-view-modes button.active { color:#fff; background:#ff7000; border-color:#ff7000; }
.fleet-content { display:grid; grid-template-columns:250px minmax(0,1fr); gap:18px; align-items:start; }
.fleet-filters { padding:15px; border:1px solid #294b58; background:#0d2834; border-radius:6px; display:grid; gap:8px; }
.fleet-filter-head,.fleet-results-head,.fleet-result-tools { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.fleet-filter-head h3,.fleet-results-head h3 { margin:0; font-size:16px; }
.fleet-filter-head button { background:none; border:0; color:#b7cbd2; cursor:pointer; font-size:12px; }
.fleet-filters h4 { margin:13px 0 2px; font-size:12px; }
.fleet-filters > label:not(.fleet-check),.fleet-result-tools label { color:#ccdde2; font-size:12px; }
.fleet-filters :is(input[type='search'],select),.fleet-result-tools select { width:100%; min-height:34px; background:#102f3c; color:#f0f6f8; border:1px solid #3b5965; border-radius:5px; padding:5px 9px; }
.fleet-check { display:flex; align-items:center; gap:9px; min-height:23px; font-size:13px; cursor:pointer; }
body.strw-remake .fleet-check input[type='checkbox'],body.strw-remake .settings-wrap .set-check input[type='checkbox'] { appearance:none !important; flex:0 0 17px; width:17px !important; min-width:17px !important; height:17px !important; min-height:17px !important; margin:0; padding:0; border:1px solid #8da7b0; border-radius:3px !important; background:#0a2530; cursor:pointer; }
body.strw-remake .fleet-check input[type='checkbox']:checked,body.strw-remake .settings-wrap .set-check input[type='checkbox']:checked { background:#ff7000; border-color:#ff7000; }
body.strw-remake .fleet-check input[type='checkbox']:checked::after,body.strw-remake .settings-wrap .set-check input[type='checkbox']:checked::after { content:''; display:block; width:8px; height:5px; margin:3px 0 0 3px; border-left:2px solid white; border-bottom:2px solid white; transform:rotate(-45deg); }
.fleet-results { min-width:0; }
.fleet-results-head { min-height:40px; margin-bottom:8px; }
.fleet-result-tools label { display:flex; align-items:center; gap:8px; }
.fleet-result-tools select { width:auto; min-width:126px; }
.fleet-view-modes { display:flex; gap:3px; }
.fleet-view-modes button { min-width:36px; padding:5px; font-size:19px; line-height:1; }
.fleet-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.fleet-card { min-width:0; overflow:hidden; border:1px solid #31525e; border-radius:6px; background:#102c38; }
.fleet-photo { height:150px; position:relative; background:#0c222c; display:flex; justify-content:center; align-items:center; overflow:hidden; }
.fleet-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.fleet-photo-icon { font-size:42px; opacity:.65; }
.fleet-symbol { position:absolute; left:8px; bottom:6px; color:#152b34; background:rgba(243,248,250,.82); padding:2px 5px; border-radius:3px; font-size:10px; }
.fleet-favorite { position:absolute; top:6px; right:6px; width:31px; height:31px; border:0; border-radius:4px; background:rgba(4,20,27,.75); color:white; font-size:23px; line-height:1; cursor:pointer; }
.fleet-favorite.active { color:#ffbc37; }
.fleet-card-main { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px; width:100%; padding:11px; border:0; background:transparent; color:#f1f6f8; text-align:left; cursor:pointer; }
.fleet-card-main strong,.fleet-card-main small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fleet-card-main strong { font-size:14px; }
.fleet-card-main small,.fleet-card-type,.fleet-card-location,.fleet-defect-count { font-size:11px; color:#bfd0d7; }
.fleet-card-location,.fleet-defect-count { grid-column:1/-1; }
.fleet-defect-count { color:#ffba70; }
.fleet-grid.list { grid-template-columns:1fr; }
.fleet-grid.list .fleet-card { display:grid; grid-template-columns:160px minmax(0,1fr); }
.fleet-grid.list .fleet-photo { height:90px; }
.fleet-grid.list .fleet-card-main { align-content:center; }
.fleet-empty { grid-column:1/-1; border:1px dashed #43606b; padding:40px 16px; text-align:center; color:#bed0d6; }
.fleet-manage { margin-top:16px; }
.fleet-detail { width:min(520px,calc(100% - 24px)); max-height:calc(100dvh - 36px); border:1px solid #55717b; border-radius:7px; background:#0d2834; color:#f0f6f8; padding:20px; overflow:auto; }
.fleet-detail::backdrop { background:rgba(0,8,12,.75); }
.fleet-detail-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.fleet-detail-head h3 { margin:0; font-size:21px; }
.fleet-detail-head button { border:0; background:transparent; color:white; font-size:25px; cursor:pointer; }
.fleet-detail-image { width:100%; max-height:230px; object-fit:contain; background:#132f3b; margin:14px 0; }
.fleet-detail dl { display:grid; gap:0; margin:12px 0 20px; }
.fleet-detail dl div { display:grid; grid-template-columns:110px 1fr; gap:12px; border-bottom:1px solid #31525e; padding:9px 0; }
.fleet-detail dt { color:#a9c0c8; }
.fleet-detail dd { margin:0; }
@media(max-width:1100px) { .fleet-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { body.strw-remake .vehicle-page { padding:12px 14px 28px; } .fleet-content { grid-template-columns:1fr; } .fleet-filters { grid-template-columns:repeat(2,minmax(0,1fr)); } .fleet-filter-head,.fleet-filters h4,.fleet-filters > label:not(.fleet-check),.fleet-filters > input,.fleet-filters > select { grid-column:1/-1; } .fleet-grid { grid-template-columns:1fr; } .fleet-results-head { align-items:flex-start; flex-wrap:wrap; } .fleet-type-tabs { flex-wrap:nowrap; overflow:auto; padding-bottom:4px; } .fleet-type-tabs button { flex:none; } }

/* Report period controls mirror the compact calendar workflow. */
body.strw-remake .repHeroMeta { display:none !important; }
body.strw-remake .repTopBar { padding:12px 20px !important; min-height:0 !important; }
body.strw-remake .repTopLeft { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
body.strw-remake :is(.repYearRow,#repYearMore,#repMonthBar) { display:none !important; }
body.strw-remake .repActionsRow { margin:0 !important; }
body.strw-remake .repActionsBox { border:0 !important; background:none !important; padding:0 !important; box-shadow:none !important; }
.repPeriodToolbar { display:flex; align-items:center; gap:7px; }
.repPeriodToolbar > button,.repPeriodPicker { display:flex; align-items:center; justify-content:center; min-height:38px; border:1px solid #3c5865; border-radius:5px; background:#102d39; color:#f2f7f9; padding:6px 13px; font-weight:600; cursor:pointer; }
.repPeriodToolbar > button:not(#repTodayMonth) { width:39px; padding:0; font-size:24px; }
.repPeriodToolbar > button:hover,.repPeriodPicker:hover { border-color:#ff7000; }
.repPeriodPicker { position:relative; min-width:205px; overflow:hidden; }
.repPeriodPicker input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
body.strw-remake .repPeriodPicker input { min-height:0 !important; }
@media(max-width:700px) { body.strw-remake .repTopBar { padding:10px 12px !important; } .repPeriodToolbar { width:100%; justify-content:space-between; } .repPeriodPicker { min-width:0; flex:1; } body.strw-remake .repActionsRow { margin-left:auto !important; } }

body.strw-remake #mainNav .remake-condensed-link { display:none; }

/* Final application-wide design system. Kept additive so the pre-remake UI remains recoverable. */
body.strw-remake #app.ready {
  grid-template-columns: 246px minmax(0, 1fr) auto;
  grid-template-rows: 72px auto;
}
body.strw-remake .top-logo {
  width: 246px;
  min-width: 246px;
  gap: 10px;
  cursor: pointer;
}
body.strw-remake .top-logo > img { display: none !important; }
.remake-brand-mark {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  overflow: hidden;
  border-radius: 7px;
  box-shadow: 0 4px 18px rgba(0,0,0,.28);
}
.remake-brand-mark img { width: 100%; height: 100%; object-fit: cover; }
.remake-brand-copy { min-width: 0; display: grid; align-content: center; }
.remake-brand-copy strong { color: #fff; font-size: 1.22rem; line-height: 1; font-weight: 950; white-space: nowrap; }
.remake-brand-copy strong b { color: var(--strw-orange); }
.remake-brand-copy small { margin-top: 5px; color: #d3dfe3; font-size: .52rem; line-height: 1.15; text-transform: uppercase; white-space: nowrap; }
body.strw-remake #mainNav .nav-btn { display: grid; place-items: center; align-content: center; gap: 4px; min-width: 86px; }
body.strw-remake #mainNav .nav-btn svg { width: 19px; height: 19px; }
body.strw-remake #mainNav .nav-btn span { font-size: .73rem; }
body.strw-remake #mainNav .nav-menu { gap: 0; }
body.strw-remake .top-logo { min-width: 228px; width: 228px; padding-inline: 12px !important; }
.remake-brand-mark { width: 43px; height: 43px; flex-basis: 43px; }
.remake-brand-copy strong { font-size: 1.08rem; }
.remake-brand-copy small { font-size: .46rem; }
.remake-header-tools { gap: 5px; padding-inline: 5px; }
.remake-search { width: 145px; }
.remake-search kbd { display: none; }
.remake-profile-copy { min-width: 65px; }
.remake-profile-copy strong { max-width: 92px; }
body.strw-remake #mainNav .remake-nav-direct .nav-btn,
body.strw-remake #mainNav .remake-nav-more .nav-btn { min-width: 68px; padding: 6px 5px; }
body.strw-remake #mainNav .remake-nav-direct .nav-btn span,
body.strw-remake #mainNav .remake-nav-more .nav-btn span { max-width: 82px; line-height: 1.05; white-space: normal; text-align: center; }
body.strw-remake #mainNav .remake-nav-more .dropdown { left: auto; right: 0; width: 295px; max-height: min(74vh,640px); overflow-y: auto; }
body.strw-remake #mainContent {
  width: 100%;
  max-width: none;
  padding-bottom: 36px;
}
body.strw-remake #mainContent > :not(.remake-page-hero):not(.dash-v11):not(.repHero) {
  width: min(1480px, calc(100% - 36px));
  margin-left: auto;
  margin-right: auto;
}

/* High-specificity hero assets: older module styles must never hide the photo. */
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-dashboard,
body.strw-remake .dash-v11 .dash-head.remake-hero-dashboard { background-image: url('../assets/design-remake/hero-dashboard.webp') !important; background-position: center 54% !important; }
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-office { background-image: url('../assets/design-remake/hero-office.webp') !important; background-position: center 52% !important; }
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-training { background-image: url('../assets/design-remake/hero-training.webp') !important; background-position: center 50% !important; }
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-briefing { background-image: url('../assets/design-remake/hero-briefing.webp') !important; background-position: center 48% !important; }
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-fleet { background-image: url('../assets/design-remake/hero-fleet.webp') !important; background-position: center 52% !important; }
body.strw-remake :is(.remake-page-hero,.remake-native-hero).remake-hero-login { background-image: url('../assets/design-remake/hero-login.webp') !important; background-position: center 55% !important; }
body.strw-remake .remake-page-hero,
body.strw-remake .remake-native-hero {
  min-height: 210px;
  padding: 32px 40px !important;
}
body.strw-remake .remake-page-hero::before,
body.strw-remake .remake-native-hero::before {
  background: linear-gradient(90deg,rgba(1,13,18,.91),rgba(1,13,18,.54) 43%,rgba(1,13,18,.08) 78%) !important;
}
body.strw-remake .remake-page-hero h1,
body.strw-remake .remake-native-hero h2 { max-width: 780px; font-weight: 950; }
body.strw-remake .remake-page-hero p,
body.strw-remake .remake-native-hero :is(p,.sub) { max-width: 760px; font-weight: 600; }
body.strw-remake .remake-hero-kicker { font-size: .78rem; }

/* Dashboard hierarchy from the supplied large-screen concept. */
body.strw-remake .dash-v11 { padding: 0 18px 30px; }
body.strw-remake .dash-v11 .dash-head {
  min-height: 315px;
  margin: 0 -18px !important;
  padding: 42px 50px 70px !important;
  border: 0 !important;
  align-items: center !important;
}
body.strw-remake .dash-v11 .dash-head::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,rgba(1,13,18,.89),rgba(1,13,18,.31) 55%,rgba(1,13,18,.04));
}
body.strw-remake .dash-v11 .dash-head .title { position: relative; z-index: 1; max-width: 720px; }
body.strw-remake .dash-v11 .dash-head h2 { margin: 0 !important; font-size: clamp(2.4rem,4vw,4.3rem) !important; }
body.strw-remake .dash-v11 .dash-head h2 span { color: var(--strw-orange); }
body.strw-remake .dash-v11 .dash-head .sub { margin-top: 8px; color: #fff !important; font-size: 1.15rem; }
body.strw-remake .dash-v11 .kpi-strip {
  margin-top: -58px;
  padding: 0 8px;
  grid-template-columns: repeat(6,minmax(0,1fr));
}
body.strw-remake .dash-v11 .kpi { min-height: 122px; min-width: 0; padding: 14px !important; border-radius: 8px !important; background: rgba(5,31,40,.94) !important; }
body.strw-remake .dash-v11 .kpi .k-label { color: #e3edf0; font-size: .72rem; }
body.strw-remake .dash-v11 .kpi .k-time { font-size: 1.12rem; }
body.strw-remake .dash-v11 .dash-assignment-kpi-head { align-items: flex-start; flex-wrap: wrap; }
body.strw-remake .dash-v11 .dash-assignment-kpi-head .btn { min-height: 29px; padding: 4px 6px; font-size: .65rem; }
body.strw-remake .dash-v11 .kpi.weather .k-weather { gap: 2px; }
body.strw-remake .dash-v11 .kpi.weather .k-temp { font-size: 1.35rem; }
body.strw-remake .dash-v11 .kpi.weather .wx-icon { font-size: 1.8rem; }
body.strw-remake .dash-v11 .kpi.weather .k-loc { white-space: normal; }
body.strw-remake .dash-v11 .kpi.weather #wxHint { font-size: .68rem; line-height: 1.2; }
body.strw-remake .dash-v11 .remake-kpi-link { display: flex; align-items: center; gap: 10px; text-align: left; color: #fff; cursor: pointer; }
body.strw-remake .dash-v11 .remake-kpi-link svg { width: 25px; height: 25px; flex: 0 0 25px; color: var(--strw-orange); }
body.strw-remake .dash-v11 .remake-kpi-link span { display: grid; gap: 5px; min-width: 0; }
body.strw-remake .dash-v11 .remake-kpi-link b { font-size: .85rem; }
body.strw-remake .dash-v11 .remake-kpi-link small { color: var(--strw-muted); font-size: .68rem; }
.remake-quick-actions { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); gap: 8px; padding: 0 8px; }
.remake-quick-actions button { min-width: 0; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 7px; border: 1px solid var(--strw-line); border-radius: 6px; color: #fff; background: #12313c; font-size: .73rem; font-weight: 750; cursor: pointer; }
.remake-quick-actions button:first-child { border-color: var(--strw-orange); background: var(--strw-orange); }
.remake-quick-actions button:hover { border-color: var(--strw-orange); }
.remake-quick-actions button svg { width: 17px; height: 17px; flex: 0 0 17px; }
body.strw-remake .dash-v11 .dash-grid { display: grid; padding: 0 8px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-items: start; }
body.strw-remake .dash-v11 .dash-grid > .dash-col { display: contents; }
body.strw-remake .dash-v11 .dash-grid .dash-col:first-child > .dcard:first-child { grid-column: 1; grid-row: 1; }
body.strw-remake .dash-v11 .dash-chat-card { grid-column: 2; grid-row: 1; }
body.strw-remake .dash-v11 #dashReportsCard { grid-column: 3; grid-row: 1; }
body.strw-remake .dash-v11 .dash-standby-card { grid-column: 1; grid-row: 2; }
body.strw-remake .dash-v11 .dash-grid .dcard { min-width: 0; }
body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
body.strw-remake .dash-v11 .tile.remake-tile-extra { display: none; }
body.strw-remake .dash-v11 .remake-tools-expanded .tile.remake-tile-extra { display: flex; }
.remake-tiles-toggle { min-height: 30px; padding: 5px 8px; border: 1px solid var(--strw-line); border-radius: 6px; color: #e7f0f2; background: #12313c; font-size: .68rem; cursor: pointer; }
body.strw-remake .dash-v11 .dcard-head-flex .hint { display: none; }
body.strw-remake .dash-v11 .dcard { overflow: hidden; }
body.strw-remake .dash-v11 .dcard-title { color: #fff; }
body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
body.strw-remake .dash-v11 .tile { min-height: 94px; }

/* Reports, calendar and assignment. */
body.strw-remake .repHero { min-height: 220px; margin-bottom: 0 !important; }
body.strw-remake .repTopBar { margin: 12px 18px 0; padding: 14px; }
body.strw-remake .repTilesWrap,
body.strw-remake .repWeekBlock,
body.strw-remake .repMsg { margin-left: 18px !important; margin-right: 18px !important; }
body.strw-remake .repYearRow,
body.strw-remake .repMonthRow { gap: 7px; }
body.strw-remake .repYearRow .repTabBtn,
body.strw-remake .repMonthRow .repTabBtn { min-height: 42px; }
body.strw-remake .repTile { border: 1px solid var(--strw-line) !important; }
.repOverviewBody { display: grid; grid-template-columns: minmax(0,1fr) 300px; align-items: start; gap: 12px; margin: 12px 18px; }
.repOverviewBody.list-mode { grid-template-columns: 1fr; }
body.strw-remake .repCalendarOverview { min-width: 0; border: 1px solid var(--strw-line); border-radius: 7px; background: var(--strw-panel); overflow: hidden; }
.repStats { display: grid; gap: 10px; }
.repStats[hidden] { display: none; }
.repStatPanel { padding: 12px 14px; border: 1px solid var(--strw-line); border-radius: 7px; background: var(--strw-panel); }
.repStatPanel h3 { margin: 0 0 12px; padding-bottom: 9px; border-bottom: 1px solid var(--strw-line); font-size: .96rem; }
.repStatPanel p { margin: 0; color: #b9cbd0; font-size: .8rem; }
.repStatDonut { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 144px; aspect-ratio: 1; margin: 4px auto 16px; border-radius: 50%; background: conic-gradient(#37dc91 0 var(--split-a),#ffd34a var(--split-a) var(--split-b),#a7bcc9 var(--split-b) 100%); }
.repStatDonut::before { content: ''; position: absolute; inset: 24px; border-radius: 50%; background: #0b2934; }
.repStatDonut strong,.repStatDonut small { position: relative; z-index: 1; }
.repStatDonut strong { font-size: 1.18rem; }
.repStatDonut small { color: #b9cbd0; }
.repStatLegend { display: grid; gap: 8px; }
.repStatLegend div,.repStatSummary { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .8rem; }
.repStatLegend span { display: flex; align-items: center; gap: 7px; }
.repStatLegend span::before { content: ''; width: 10px; height: 10px; border-radius: 50%; background: var(--stat-color); }
.repStatLegend b,.repStatSummary strong { white-space: nowrap; }
.repStatWeek { display: grid; grid-template-columns: 1fr auto; gap: 5px; margin: 0 0 11px; font-size: .8rem; }
.repStatWeek i { grid-column: 1 / -1; height: 7px; border-radius: 3px; background: #37dc91; max-width: 100%; }
.repCalendarToolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; }
.repCalendarToolbar h3 { margin: 0; font-size: 1rem; }
.repCalendarModes { display: flex; gap: 2px; }
.repCalendarModes button,.repCalendarWeekNav button { min-height: 34px; padding: 6px 14px; border: 1px solid var(--strw-line); border-radius: 5px; color: #edf4f6; background: #0b2b36; cursor: pointer; }
.repCalendarModes button.active { border-color: var(--strw-orange); background: var(--strw-orange); color: #fff; }
.repCalendarWeekNav:not([hidden]) { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 8px; border-top: 1px solid var(--strw-line); }
.repCalendarGrid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); border-top: 1px solid var(--strw-line); }
.repCalendarGrid[hidden] { display: none; }
.repCalendarWeekday { padding: 9px 8px; border-right: 1px solid var(--strw-line); border-bottom: 1px solid var(--strw-line); color: #e7f1f3; text-align: center; font-weight: 800; }
.repCalendarDay { min-width: 0; min-height: 105px; padding: 7px; border-right: 1px solid var(--strw-line); border-bottom: 1px solid var(--strw-line); }
.repCalendarDay.outside { opacity: .42; }
.repCalendarDay.outside:has(.repCalendarEntry) { opacity: 1; }
.repCalendarDay.weekend { background: rgba(255,255,255,.025); }
.repCalendarDate { width: 26px; height: 26px; display: grid; place-items: center; margin-bottom: 4px; font-weight: 800; }
.repCalendarDay.today .repCalendarDate { border-radius: 50%; background: var(--strw-orange); color: #fff; }
.repCalendarDay.selected { box-shadow: inset 0 0 0 2px var(--strw-orange); }
.repCalendarDay.selected:not(.today) .repCalendarDate { color: var(--strw-orange); }
.repCalendarEntry { width: 100%; display: block; margin: 3px 0; padding: 5px 6px; border: 0; border-radius: 4px; color: #061c22; background: #37dc91; text-align: left; font-size: .7rem; font-weight: 850; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.repCalendarEntry.school { background: #ffd34a; }
.repCalendarEntry.urlaub { background: #3a9fff; color: #fff; }
.repCalendarEntry.krank { background: #ff6060; color: #fff; }
.repCalendarLegend { display: flex; flex-wrap: wrap; gap: 14px; padding: 10px 14px; color: #e5eff2; font-size: .75rem; }
.repCalendarLegend span::before { content: ''; width: 11px; height: 11px; display: inline-block; margin-right: 6px; border-radius: 2px; vertical-align: -1px; background: #37dc91; }
.repCalendarLegend .school::before { background: #ffd34a; }
.repCalendarLegend .urlaub::before { background: #3a9fff; }
.repCalendarLegend .krank::before { background: #ff6060; }
.repCalendarLegend .weekend::before { background: #718e98; }
@media (max-width: 1100px) { .repOverviewBody { grid-template-columns: minmax(0,1fr); } .repStats { grid-template-columns: repeat(3,minmax(0,1fr)); } .repStatDonut { width: 110px; } }
@media (max-width: 700px) { .repOverviewBody { margin-inline: 10px; } .repStats { grid-template-columns: 1fr; } .repCalendarDay { min-height: 68px; padding: 4px; } .repCalendarEntry { font-size: .6rem; } }
body.strw-remake .vacation-page { gap: 12px; }
body.strw-remake .vacation-page .vac-head {
  padding: 14px 16px;
  border: 1px solid var(--strw-line);
  border-radius: 8px;
  background: var(--strw-panel);
}
body.strw-remake .vacation-page .vac-head h2 { margin: 0 0 4px; }
body.strw-remake .vacation-page .calendar-tabs { gap: 4px; }
body.strw-remake .vacation-page .calendar-tab { border-radius: 6px !important; background: #082832; }
body.strw-remake .vacation-page .calendar-tab.active { border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .vacation-page .category-panel { padding: 0; border: 0 !important; background: transparent !important; }
body.strw-remake .vacation-page .vac-card { border-radius: 8px; background: var(--strw-panel) !important; }
body.strw-remake .vacation-page .cal-cell { border-radius: 7px; background: #082832; }
body.strw-remake .vacation-page .cal-cell.today { border-color: var(--strw-orange); box-shadow: inset 0 0 0 1px var(--strw-orange); }
body.strw-remake .vacation-page .cal-event { border-radius: 5px; }
body.strw-remake .vacation-page .cal-remake-layout { display: grid; grid-template-columns: 250px minmax(0,1fr); gap: 12px; align-items: start; }
body.strw-remake .vacation-page .cal-remake-sidebar { padding: 14px; border: 1px solid var(--strw-line); border-radius: 7px; background: var(--strw-panel); }
body.strw-remake .vacation-page .cal-remake-sidebar h3 { margin: 0 0 12px; font-size: 1rem; }
body.strw-remake .vacation-page .cal-mini { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 2px; align-items: center; margin-bottom: 12px; }
body.strw-remake .vacation-page .cal-mini-days { grid-column: 1 / -1; padding: 4px 0; color: #c6d5d9; font-size: .73rem; text-align: center; word-spacing: 9px; }
body.strw-remake .vacation-page .cal-mini button { width: 100%; min-height: 28px; padding: 2px; border: 0; border-radius: 4px; color: #e9f1f3; background: transparent; cursor: pointer; font-size: .76rem; }
body.strw-remake .vacation-page .cal-mini button:hover,body.strw-remake .vacation-page .cal-mini button.active { background: var(--strw-orange); color: #fff; }
body.strw-remake .vacation-page .cal-today-btn { width: 100%; border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .vacation-page .cal-remake-sidebar h4 { margin: 18px 0 10px; font-size: .84rem; }
body.strw-remake .vacation-page .cal-filter-list { display: grid; gap: 10px; }
body.strw-remake .vacation-page .cal-filter-list label { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .8rem; font-weight: 600; }
body.strw-remake .vacation-page .cal-filter-list input { appearance: none !important; flex: 0 0 17px; width: 17px !important; min-width: 17px !important; height: 17px !important; min-height: 17px !important; margin: 0; padding: 0; border: 1px solid #91aab2; border-radius: 3px; background: #0a2731; cursor: pointer; }
body.strw-remake .vacation-page .cal-filter-list input:checked { border-color: var(--strw-orange); background: var(--strw-orange); }
body.strw-remake .vacation-page .cal-filter-list input:checked::before { content: ''; display: block; width: 8px; height: 5px; margin: 3px 0 0 3px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
body.strw-remake .vacation-page .cal-filter-dot { width: 11px; height: 11px; border-radius: 50%; background: #b1c7d1; }
body.strw-remake .vacation-page .cal-filter-dot.vac { background: #3a9fff; }
body.strw-remake .vacation-page .cal-filter-dot.standby { background: #37dc91; }
body.strw-remake .vacation-page .cal-filter-dot.ot { background: #ffd34a; }
body.strw-remake .vacation-page .cal-filter-dot.off { background: #ff934d; }
body.strw-remake .vacation-page .cal-filter-dot.custom { background: #b59ef5; }
body.strw-remake .vacation-page .cal-remake-main { display: flex; flex-direction: column; min-width: 0; padding: 0; overflow: hidden !important; }
body.strw-remake .vacation-page .cal-remake-main .cal-toolbar { order: 1; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--strw-line); }
body.strw-remake .vacation-page .cal-remake-main .cal-weekdays { order: 2; gap: 0; margin: 0; color: #eaf3f5; }
body.strw-remake .vacation-page .cal-remake-main .cal-weekdays span { padding: 10px 5px; border-right: 1px solid var(--strw-line); text-align: center; }
body.strw-remake .vacation-page .cal-remake-main .cal-grid { order: 3; gap: 0; border-top: 1px solid var(--strw-line); }
body.strw-remake .vacation-page .cal-remake-main .cal-cell { min-height: 103px; border: 0; border-right: 1px solid var(--strw-line); border-bottom: 1px solid var(--strw-line); border-radius: 0; background: transparent; }
body.strw-remake .vacation-page .cal-remake-main .cal-cell.today .cal-day { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--strw-orange); }
body.strw-remake .vacation-page .cal-remake-main .cal-cell.selected { box-shadow: inset 0 0 0 2px var(--strw-orange); }
body.strw-remake .vacation-page .cal-remake-main .cal-stats { order: 4; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; margin: 0; border-top: 1px solid var(--strw-line); }
body.strw-remake .vacation-page .cal-remake-main .cal-stats .stat { padding: 10px 12px; border: 0; border-right: 1px solid var(--strw-line); border-radius: 0; background: transparent; }
body.strw-remake .vacation-page .cal-remake-main .cal-stats .num { font-size: 1.2rem; }
body.strw-remake .vacation-page .cal-remake-main .cal-stats .lbl { color: #e6f0f2; }
body.strw-remake .vacation-page .cal-remake-modes { display: flex; gap: 2px; }
body.strw-remake .vacation-page .cal-remake-modes button { min-height: 34px; padding: 6px 16px; border: 1px solid var(--strw-line); border-radius: 4px; color: #e9f1f3; background: #0a2b36; cursor: pointer; }
body.strw-remake .vacation-page .cal-remake-modes button.active { border-color: var(--strw-orange); background: var(--strw-orange); color: #fff; }
body.strw-remake .vacation-page .cal-list { order: 3; min-height: 250px; padding: 12px; }
body.strw-remake .vacation-page .cal-list-row { width: 100%; display: grid; grid-template-columns: 130px 1fr; gap: 12px; align-items: center; margin-bottom: 5px; padding: 9px; border: 1px solid var(--strw-line); border-radius: 5px; color: #eef5f6; background: #0a2b36; text-align: left; cursor: pointer; }
body.strw-remake .vacation-page .cal-list-row > span { display: flex; flex-wrap: wrap; gap: 5px; }
body.strw-remake .vacation-page .cal-list-row .cal-event { width: auto; }
@media (max-width: 950px) { body.strw-remake .vacation-page .cal-remake-layout { grid-template-columns: 1fr; } body.strw-remake .vacation-page .cal-remake-sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; } body.strw-remake .vacation-page .cal-remake-sidebar h3,body.strw-remake .vacation-page .cal-remake-sidebar h4 { grid-column: 1 / -1; } }
@media (max-width: 700px) { body.strw-remake .vacation-page .cal-remake-sidebar { display: block; } body.strw-remake .vacation-page .cal-remake-main .cal-weekdays { display: grid; } body.strw-remake .vacation-page .cal-remake-main .cal-grid { grid-template-columns: repeat(7,minmax(0,1fr)); } body.strw-remake .vacation-page .cal-remake-main .cal-cell { min-height: 64px; padding: 3px; } body.strw-remake .vacation-page .cal-remake-main .cal-events { display: none; } body.strw-remake .vacation-page .cal-remake-main .cal-cell:has(.cal-event)::after { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--strw-orange); } body.strw-remake .vacation-page .cal-list-row { grid-template-columns: 1fr; } }
body.strw-remake .assign-page { width: min(1560px,calc(100% - 28px)) !important; }
body.strw-remake .assign-page .assign-hero { margin: 0 0 12px !important; }
body.strw-remake .assign-datebox { position: relative; z-index: 2; border-color: rgba(255,255,255,.3); background: rgba(2,19,25,.75); backdrop-filter: blur(12px); }
body.strw-remake .assign-list-card { padding: 12px; }
body.strw-remake .assign-board { gap: 10px; }

/* Editors and data-heavy tools. */
body.strw-remake .wr-page { padding: 0 18px 34px; }
body.strw-remake .wr-page { max-width: 1580px !important; }
body.strw-remake .wr-page > .wr-top { position: sticky; top: 72px; z-index: 80; border: 1px solid var(--strw-line); }
body.strw-remake .wr-page > .wr-top { background: var(--strw-panel) !important; box-shadow: none !important; }
body.strw-remake .wr-day-nav { display: flex; align-items: center; gap: 6px; margin-top: 7px; }
body.strw-remake .wr-day-nav > .wr-btn { flex: 0 0 34px; width: 34px; min-width: 34px; height: 32px; padding: 0 !important; font-size: 22px; }
body.strw-remake .wr-day-picker { position: relative; display: grid; place-items: center; min-width: 105px; height: 32px; padding: 0 9px; border: 1px solid var(--strw-line-strong); border-radius: 5px; background: #102d39; color: #f2f7f9; font-size: 12px; font-weight: 700; cursor: pointer; }
body.strw-remake .wr-day-picker input { position: absolute; inset: 0; width: 100% !important; height: 100% !important; min-height: 0 !important; padding: 0 !important; opacity: 0; cursor: pointer; }
body.strw-remake .remake-report-layout { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.4fr) minmax(0,1fr); gap: 12px; align-items: start; }
body.strw-remake .remake-report-column { display: grid; gap: 12px; min-width: 0; }
body.strw-remake .remake-report-column > .wr-card { margin: 0; min-width: 0; }
body.strw-remake .remake-report-column > .wr-card.wr-hide { display: none; }
body.strw-remake .remake-report-column > .wr-card h2 { color: #f2f7f8 !important; font-size: 1rem; }
body.strw-remake .wr-arp-card .wr-arpComboMenu.open { position: static !important; width: 100% !important; margin-top: 6px; max-height: min(280px, 40vh); }
body.strw-remake .wr-workdata-view { grid-template-columns: minmax(0,1fr); gap: 12px; }
body.strw-remake .remake-report-column:first-child .wr-grid3 { grid-template-columns: minmax(0,1fr) !important; }
body.strw-remake .wr-workdata-view > div { min-width: 0; }
body.strw-remake .wr-workdata-view .wr-view-wide { grid-column: auto; }
body.strw-remake .wr-workdata-view .wr-pill,
body.strw-remake #wr-tasksCard #wr-taskList .wr-pill {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere;
}
body.strw-remake #wr-tasksCard #wr-taskList .wr-pill > div { min-width: 0; overflow-wrap: anywhere; }
body.strw-remake #wr-tasksCard .wr-streetLine { grid-template-columns: minmax(0,1fr) !important; align-items: start; }
body.strw-remake #wr-tasksCard .wr-locationActions { display: flex !important; flex-wrap: wrap !important; align-items: center; justify-content: flex-start !important; gap: 8px; min-width: 0; }
body.strw-remake #wr-tasksCard .wr-locationActions .wr-checkline { min-height: 36px; padding: 0; margin-right: 6px !important; white-space: normal; opacity: 1; cursor: pointer; }
body.strw-remake #wr-tasksCard .wr-locationActions input[type='checkbox'] { appearance: none !important; -webkit-appearance: none !important; flex: 0 0 20px; width: 20px !important; min-width: 20px !important; max-width: 20px !important; height: 20px !important; min-height: 20px !important; max-height: 20px !important; margin: 0; padding: 0 !important; border: 2px solid #9ab3bd !important; border-radius: 4px !important; background: #08222d !important; box-sizing: border-box; cursor: pointer; }
body.strw-remake #wr-tasksCard .wr-locationActions input[type='checkbox']:checked { background: #ff7000 !important; border-color: #ff7000 !important; }
body.strw-remake #wr-tasksCard .wr-locationActions input[type='checkbox']:checked::after { content: ''; display: block; width: 9px; height: 5px; margin: 3px 0 0 3px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
body.strw-remake #wr-tasksCard .wr-locationActions .wr-btn { flex: 0 0 auto; width: auto !important; min-width: 0; }
body.strw-remake #wr-tasksCard .wrrsa-summary { gap: 10px; }
body.strw-remake #wr-tasksCard .wrrsa-summary + .wrrsa-summary { margin-top: 8px; }
body.strw-remake #wr-tasksCard .wrrsa-summary-body { min-width: 0; flex: 1; }
body.strw-remake #wr-tasksCard .t-rsa-remove { flex: 0 0 34px; width: 34px; padding: 5px; margin-left: auto; }
body.strw-remake .wr-page .wr-productivity-bar { margin: 4px 0 9px; }
@media (max-width: 1200px) { body.strw-remake .remake-report-layout { grid-template-columns: repeat(2,minmax(0,1fr)); } body.strw-remake .remake-report-column:last-child { grid-column: 1 / -1; grid-template-columns: minmax(0,1fr); } }
@media (max-width: 700px) { body.strw-remake .remake-report-layout { display: block; } body.strw-remake .remake-report-column,body.strw-remake .remake-report-column:last-child { display: grid; grid-template-columns: 1fr; gap: 10px; margin-bottom: 10px; } }
body.strw-remake .wr-grid2,
body.strw-remake .wr-grid3 { gap: 12px; }
body.strw-remake .wr-card { border-radius: 8px !important; }
body.strw-remake .wr-card > h2,
body.strw-remake .wr-card > h3 { display: flex; align-items: center; gap: 8px; }
body.strw-remake .an-page { padding: 0 18px 30px; }
body.strw-remake .an-page .an-hero { margin: 0 -18px 12px !important; }
body.strw-remake .an-panel { grid-template-columns: minmax(260px,.8fr) minmax(0,2fr) minmax(250px,.75fr); align-items: start; }
body.strw-remake .an-section { min-width: 0; }
body.strw-remake .an-section-person { grid-column: 1; grid-row: 1; }
body.strw-remake .an-section-media { grid-column: 2; }
body.strw-remake .an-section-saved { grid-column: 3; grid-row: 1 / span 3; }
body.strw-remake .an-section-export { grid-column: 1 / 3; }
body.strw-remake :is(.tool-page,.knowledge-page,.project-v31,.notes-page,.chat-page,.map-page,.travel-page,.manage-shell,.support-wrap,.settings-wrap,.calc-container) { min-width: 0; }
body.strw-remake :is(.tool-page,.knowledge-page,.project-v31,.notes-page,.chat-page,.map-page,.travel-page,.manage-shell,.support-wrap,.settings-wrap,.calc-container) > :is(.card,.glass,.glass-strong) { border-radius: 8px !important; }
body.strw-remake :is(.project-v31,.settings-wrap,.manage-shell,.support-wrap,.notes-page,.chat-page) { gap: 12px; }
body.strw-remake :is(.tbl,.manage-table,table) { color: var(--strw-text); }
body.strw-remake :is(.tbl,.manage-table,table) th { color: #d7e6eb; background: rgba(255,255,255,.035); }
body.strw-remake :is(.tbl,.manage-table,table) td { border-color: var(--strw-line); }
body.strw-remake .settings-layout { grid-template-columns: 230px minmax(0,1fr); gap: 12px; }
body.strw-remake .settings-nav { position: sticky; top: 86px; align-self: start; }
body.strw-remake .settings-nav-item { min-height: 44px; text-align: left; border: 1px solid transparent; border-radius: 6px !important; }
body.strw-remake .settings-nav-item.active { border-color: var(--strw-orange) !important; box-shadow: inset 3px 0 var(--strw-orange); }
body.strw-remake .settings-section { gap: 12px; }
body.strw-remake .settings-overview-col { display: contents; }
body.strw-remake .settings-sections.overview { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-items: start; }
body.strw-remake .settings-sections.overview .settings-overview-col { display: grid; align-content: start; gap: 12px; min-width: 0; }
body.strw-remake .settings-sections.overview .settings-section { gap: 12px; min-width: 0; padding: 0; border: 0 !important; background: none !important; box-shadow: none !important; }
body.strw-remake .settings-sections.overview .settings-section-head { display: none; }
body.strw-remake .settings-sections.overview .set-card { min-width: 0; padding: 14px; }
body.strw-remake .settings-sections.overview .set-card h3 { margin: 0 0 12px; padding-bottom: 9px; border-bottom: 1px solid var(--strw-line); font-size: 1rem; }
body.strw-remake .settings-sections.overview .set-row { display: grid; grid-template-columns: minmax(100px,.6fr) minmax(0,1fr); align-items: center; gap: 7px 10px; margin-bottom: 9px; }
body.strw-remake .settings-sections.overview .set-row > label:first-child:not(.set-check) { margin: 0; font-size: .78rem; }
body.strw-remake .settings-sections.overview .set-row > .muted { grid-column: 1 / -1; font-size: .73rem; }
body.strw-remake .settings-sections.overview .set-row input,body.strw-remake .settings-sections.overview .set-row select { min-height: 34px; padding: 6px 9px; }
body.strw-remake .settings-sections.overview .set-row-inline { display: flex; }
body.strw-remake .settings-sections.overview .set-actions { margin-top: 10px; }
@media (max-width: 1200px) { body.strw-remake .settings-sections.overview { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) { body.strw-remake .settings-sections.overview { grid-template-columns: 1fr; } body.strw-remake .settings-sections.overview .set-row { grid-template-columns: 1fr; } }
body.strw-remake .set-card { border-radius: 8px !important; background: var(--strw-panel) !important; border-color: var(--strw-line) !important; }
body.strw-remake .support-grid { min-height: 520px; }
body.strw-remake :is(.support-list,.support-detail) { overflow: hidden; }
body.strw-remake .rsa-plan-grid { grid-template-columns: repeat(auto-fill,minmax(235px,1fr)); }
body.strw-remake .rsa-plan-card { overflow: hidden; }
body.strw-remake .map-page .card { overflow: hidden; }
body.strw-remake #mainContent :is(.card,.glass,.glass-strong,.an-section,.set-card,.support-wrap,.tool-page,.knowledge-page,.calc-container) :is(h2,h3) {
  color: #f5f8f9;
}
body.strw-remake input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 8px 12px;
  border: 1px solid #45636e;
  border-radius: 6px;
  color: #fff;
  background: #123540;
  font-weight: 800;
  cursor: pointer;
}
body.strw-remake input[type="file"]::file-selector-button:hover { border-color: var(--strw-orange); background: #17414e; }

/* Calculator: compact workbench instead of a long single-column form. */
body.strw-remake .calc-container {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
  align-items: start;
}
body.strw-remake .calc-container > h2 { grid-column: 1 / -1; margin: 0; color: #fff; }
body.strw-remake .calc-section { min-width: 0; height: 100%; padding: 16px; }
body.strw-remake .calc-section:nth-of-type(4) { grid-column: 1 / -1; }
body.strw-remake .calc-section h3 { margin: 0 0 14px; color: #fff; }
body.strw-remake .calc-section .inputs { display: grid; gap: 10px; }
body.strw-remake .calc-section label { display: grid; gap: 6px; color: #dce8ec; font-weight: 750; }
body.strw-remake .calc-section input { width: 100%; }
body.strw-remake .calc-btn {
  min-height: 42px;
  margin-top: 14px;
  padding: 9px 16px;
  border: 1px solid var(--strw-orange) !important;
  border-radius: 6px !important;
  color: #fff !important;
  background: var(--strw-orange) !important;
  font-weight: 850;
}
body.strw-remake .calc-output:not(:empty) { margin-top: 12px; }
body.strw-remake .result-box { border: 1px solid var(--strw-line); border-radius: 7px; background: rgba(1,18,25,.68); }
body.strw-remake .canvas-box { max-width: 100%; overflow: auto; }
body.strw-remake .canvas-box canvas { max-width: 100%; height: auto; }

/* Consistent controls, switches, feedback and motion. */
body.strw-remake :is(.btn,.wr-btn,.repTabBtn,.calendar-tab,.manage-tab,.settings-nav-item,.allpages-item) {
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
@media (hover:hover) {
  body.strw-remake :is(.btn,.wr-btn,.repTabBtn,.calendar-tab,.manage-tab,.allpages-item):hover:not(:disabled) { transform: translateY(-1px); border-color: rgba(255,122,31,.68); }
  body.strw-remake :is(.card,.dcard,.kpi,.wr-card,.an-section,.set-card):hover { border-color: rgba(176,205,215,.34) !important; }
}
body.strw-remake :is(button,input,select,textarea):disabled { opacity: .55; cursor: not-allowed; }
body.strw-remake ::placeholder { color: #7f9aa4; opacity: 1; }
body.strw-remake ::selection { color: #fff; background: rgba(255,105,0,.72); }
body.strw-remake .login-error:not(:empty),
body.strw-remake .error-box { border-radius: 7px; }

@media (min-width: 851px) and (max-width: 1180px) {
  body.strw-remake #app.ready { grid-template-columns: 190px minmax(0,1fr) auto; }
  body.strw-remake .top-logo { width: 190px; min-width: 190px; }
  .remake-brand-copy strong { font-size: 1rem; }
  .remake-brand-copy small { display: none; }
  body.strw-remake #mainNav .nav-btn { min-width: 70px; padding-inline: 7px; }
  body.strw-remake #mainNav .nav-btn span { font-size: .66rem; }
  body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  body.strw-remake #mainNav .nav-container { overflow-x: auto; overflow-y: visible; }
  body.strw-remake #mainNav .nav-menu { width: max-content; }
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }
  body.strw-remake .dash-v11 .dash-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.strw-remake .dash-v11 .dash-chat-card { grid-column: 2; grid-row: 1; }
  body.strw-remake .dash-v11 #dashReportsCard { grid-column: 1; grid-row: 2; }
  body.strw-remake .dash-v11 .dash-standby-card { grid-column: 2; grid-row: 2; }
  .remake-quick-actions { grid-template-columns: repeat(4,minmax(0,1fr)); }
  body.strw-remake .an-panel { grid-template-columns: minmax(240px,.8fr) minmax(0,1.7fr); }
  body.strw-remake .an-section-person { grid-column: 1; }
  body.strw-remake .an-section-media { grid-column: 2; }
  body.strw-remake .an-section-export { grid-column: 1 / -1; }
  body.strw-remake .an-section-saved { grid-column: 1 / -1; grid-row: auto; }
  body.strw-remake .calc-container { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.strw-remake .calc-section:nth-of-type(4) { grid-column: 1 / -1; }
}

@media (max-width: 850px) {
  body.strw-remake #app.ready { grid-template-columns: minmax(0,1fr) auto; }
  body.strw-remake .top-logo { width: auto; min-width: 0; }
  .remake-brand-mark { width: 44px; height: 44px; flex-basis: 44px; }
  .remake-brand-copy strong { font-size: 1.04rem; }
  .remake-brand-copy small { display: none; }
  body.strw-remake #mainContent > :not(.remake-page-hero):not(.dash-v11):not(.repHero) { width: calc(100% - 20px); }
  body.strw-remake .remake-page-hero,
  body.strw-remake .remake-native-hero { min-height: 190px; padding: 24px 18px !important; }
  body.strw-remake .remake-page-hero::before,
  body.strw-remake .remake-native-hero::before { background: linear-gradient(90deg,rgba(1,13,18,.86),rgba(1,13,18,.42) 64%,rgba(1,13,18,.12)) !important; }
  body.strw-remake .dash-v11 { padding: 0 10px 22px; }
  body.strw-remake .dash-v11 .dash-head { min-height: 270px; margin: 0 -10px !important; padding: 34px 18px 80px !important; }
  body.strw-remake .dash-v11 .dash-head h2 { font-size: 2.2rem !important; }
  body.strw-remake .dash-v11 .dash-head .sub { font-size: .95rem; }
  body.strw-remake .dash-v11 .kpi-strip { margin-top: -62px; padding: 0; grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.strw-remake .dash-v11 .kpi { min-height: 112px; }
  body.strw-remake .dash-v11 .dash-assignment-kpi { grid-column: 1 / -1; }
  body.strw-remake .dash-v11 .dash-grid { padding: 0; grid-template-columns: 1fr; }
  body.strw-remake .dash-v11 .dash-grid .dcard { grid-column: 1 !important; grid-row: auto !important; }
  .remake-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0; }
  body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.strw-remake .repTopBar,
  body.strw-remake .repTilesWrap,
  body.strw-remake .repWeekBlock,
  body.strw-remake .repMsg { margin-left: 10px !important; margin-right: 10px !important; }
  body.strw-remake .repYearRow { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  body.strw-remake .repMonthRow { grid-template-columns: repeat(3,minmax(0,1fr)); }
  body.strw-remake .repCalendarOverview { margin-inline: 10px; }
  .repCalendarDay { min-height: 75px; }
  .repCalendarEntry { font-size: .6rem; }
  body.strw-remake .vacation-page .vac-head { align-items: stretch; }
  body.strw-remake .vacation-page .calendar-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; }
  body.strw-remake .vacation-page .cal-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.strw-remake .assign-page { width: 100% !important; }
  body.strw-remake .assign-page .assign-hero { margin-inline: 0 !important; }
  body.strw-remake .assign-datebox { width: 100%; }
  body.strw-remake .assign-date-actions { grid-template-columns: minmax(0,1fr) auto; }
  body.strw-remake .assign-board-wrap { margin-inline: 0; padding-bottom: 6px; }
  body.strw-remake .wr-page { width: 100% !important; padding: 0 10px 100px !important; }
  body.strw-remake .wr-page > .wr-top { top: 68px; }
  body.strw-remake .an-page { width: 100% !important; padding: 0 10px 24px; }
  body.strw-remake .an-page .an-hero { margin: 0 -10px 10px !important; }
  body.strw-remake .an-panel { display: block; }
  body.strw-remake .an-section { margin-bottom: 10px; }
  body.strw-remake .settings-layout { grid-template-columns: 1fr; }
  body.strw-remake .settings-nav { position: static; display: flex; overflow-x: auto; padding: 6px; }
  body.strw-remake .settings-nav-item { flex: 0 0 auto; }
  body.strw-remake :is(.manage-table-wrap,.table-wrap) { overflow-x: auto; }
  body.strw-remake :is(.manage-table,.tbl) { min-width: 720px; }
  body.strw-remake .support-grid { grid-template-columns: 1fr; min-height: 0; }
  body.strw-remake .support-list { max-height: 330px; }
  body.strw-remake .calc-container { grid-template-columns: 1fr; }
  body.strw-remake .calc-section:nth-of-type(4) { grid-column: auto; }
}

@media (max-width: 470px) {
  .remake-brand-copy strong { font-size: .92rem; }
  body.strw-remake .remake-header-tools { gap: 2px; padding-right: 5px; }
  body.strw-remake .remake-head-icon { display: none; }
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns: 1fr; }
  .remake-quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.strw-remake .dash-v11 .tiles.tiles-compact { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.strw-remake .repMonthRow { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .repCalendarGrid { overflow-x: auto; }
  .repCalendarDay { padding: 3px; min-height: 64px; }
  .repCalendarWeekday { padding: 7px 2px; font-size: .68rem; }
  .repCalendarEntry { padding: 3px; }
  body.strw-remake .vacation-page .cal-grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  body.strw-remake .top-logo-text h1 { font-size: .9rem !important; }
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns: 1fr; }
  body.strw-remake .dash-v11 .kpi.weather { grid-column: auto; }
  .remake-login-benefits { grid-template-columns: repeat(2, 1fr); }
  body.strw-remake .repTile { grid-template-columns: 58px minmax(0, 1fr); }
}

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

body.strw-remake :is(.remake-login-brand,.top-logo,.splash-screen) img[src*='brand-logo-original'] { mix-blend-mode: normal; filter: none; }
/* Consistent controls and public request dialogs across browsers. */
body.strw-remake :is(#loginRemember, #regAzubi) {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  padding: 0 !important;
  flex: 0 0 16px;
  border: 1px solid #acb8bd !important;
  border-radius: 3px !important;
  background: rgba(0,0,0,.18) !important;
  display: grid;
  place-content: center;
  cursor: pointer;
}
body.strw-remake :is(#loginRemember, #regAzubi):checked { background: #ff7000 !important; border-color: #ff7000 !important; }
body.strw-remake :is(#loginRemember, #regAzubi):checked::after {
  content: '';
  width: 8px;
  height: 4px;
  border-left: 2px solid white;
  border-bottom: 2px solid white;
  transform: translateY(-1px) rotate(-45deg);
}
body.strw-remake #publicSupportModal { background: rgba(0,8,12,.48); backdrop-filter: blur(8px); padding: 24px; overflow-y: auto; }
body.strw-remake #publicSupportModal .public-support-card {
  width: min(650px,100%);
  max-height: calc(100dvh - 48px);
  padding: 26px;
  overflow-y: auto;
  background: rgba(12,20,24,.88) !important;
  border: 1px solid rgba(220,231,235,.3) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(20px);
  box-shadow: 0 28px 90px rgba(0,0,0,.4);
}
body.strw-remake #publicSupportModal .public-support-head { padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.14); }
body.strw-remake #publicSupportTitle { color: #fff; font-size: 23px; line-height: 1.2; }
body.strw-remake #publicSupportClose { background: transparent; font-weight: 500; font-size: 12px; }
body.strw-remake #publicMeistereiForm.active { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
body.strw-remake #publicMeistereiForm .login-field { margin: 0; min-width: 0; }
body.strw-remake #publicMeistereiForm .login-field:nth-child(n+5),
body.strw-remake #publicMeistereiForm .login-actions { grid-column: 1/-1; }
body.strw-remake #publicSupportModal label { font-size: 13px; color: #d6dfe3; font-weight: 500; margin-bottom: 7px; }
body.strw-remake #publicSupportModal :is(input,textarea) { background: rgba(255,255,255,.055) !important; border-color: rgba(222,232,237,.26) !important; border-radius: 8px !important; font-weight: 400; }
body.strw-remake #publicSupportModal textarea { min-height: 100px; font-size: 14px; }
body.strw-remake #publicSupportModal .login-actions { margin: 6px 0 0; }
body.strw-remake #publicSupportInfo:empty { display: none; }
@media(max-width:600px) {
  body.strw-remake #publicSupportModal { padding: 12px; }
  body.strw-remake #publicSupportModal .public-support-card { padding: 20px; max-height: calc(100dvh - 24px); }
  body.strw-remake #publicMeistereiForm.active { grid-template-columns: minmax(0,1fr); gap: 14px; }
  body.strw-remake #publicSupportTitle { font-size: 20px; }
  body.strw-remake #publicSupportModal :is(input,textarea) { font-size: 16px; }
}

/* Login composition matched to the supplied desktop reference. */
body.strw-remake #loginOverlay {
  padding: 36px 24px 64px;
  overflow-y: auto;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 440px) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  background-position: center;
}
body.strw-remake #loginOverlay::before { position: fixed; background: rgba(0, 8, 12, .10); pointer-events: none; }
body.strw-remake #loginOverlay .login-card {
  grid-column: 2;
  width: 100%;
  max-height: none;
  overflow: visible;
  padding: 32px;
  background: rgba(9, 17, 21, .77);
  border: 1px solid rgba(220, 231, 235, .3);
  border-radius: 12px;
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 60px rgba(0, 0, 0, .25);
}
.remake-login-identity { grid-column: 1; width: 100%; max-width: 410px; position: relative; z-index: 1; justify-self: center; text-align: center; }
body.strw-remake .remake-login-brand { margin: 0; }
body.strw-remake .remake-login-brand img { width: 100%; max-width: 360px; max-height: none; height: auto; }
.remake-login-slogan, .remake-login-motto { font-family: 'Segoe Print', 'Bradley Hand', cursive; font-style: italic; color: #fff; text-shadow: 0 2px 8px #000; }
.remake-login-slogan { width: fit-content; margin: 26px auto 40px; font-size: 25px; line-height: 1.35; transform: rotate(-7deg); }
.remake-login-slogan::after, .remake-login-motto::after { content: ''; display: block; height: 4px; background: #ff7900; transform: rotate(-7deg); margin-top: 5px; }
.remake-login-motto { position: absolute; right: 30px; top: 26px; font-size: 22px; line-height: 1.1; transform: rotate(-9deg); }
.remake-login-footer { position: absolute; left: 32px; bottom: 22px; color: #c0c9cd; font-size: 11px; }
.remake-login-footer span { margin-left: 14px; padding-left: 14px; border-left: 1px solid #7c898e; }
body.strw-remake .remake-login-welcome h1 { font-size: 26px; line-height: 1.2; }
body.strw-remake .remake-login-welcome p { font-size: 14px; font-weight: 400; line-height: 1.45; max-width: 270px; margin: 8px auto 24px !important; }
body.strw-remake .login-tabs { gap: 18px; margin: 0 0 18px; }
body.strw-remake .login-tabs .btn { min-height: 30px; padding: 4px 0; flex: none; font-size: 12px; border: 0; border-bottom: 2px solid transparent; border-radius: 0 !important; background: transparent; color: #b8c1c5; }
body.strw-remake .login-tabs .btn.active { background: transparent; color: #ff8a38; border-color: #ff6900; }
body.strw-remake #loginForm > p { display: none; }
body.strw-remake .login-field { margin: 12px 0; }
body.strw-remake .login-field input:not([type='checkbox']), body.strw-remake .login-field select { min-height: 46px; padding: 10px 13px; background: rgba(255,255,255,.055) !important; border-color: rgba(222,232,237,.3) !important; font-size: 14px; font-weight: 400; }
body.strw-remake .login-field :is(#loginEmail, #loginPass) { padding-left: 43px; padding-right: 44px; }
body.strw-remake :is(.remake-field-mail, .remake-field-pass) > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.remake-input-icon { position: absolute; top: 0; left: 14px; height: 46px; display: flex; align-items: center; color: #e3e9ec; pointer-events: none; }
.remake-input-icon svg { width: 18px; height: 18px; }
body.strw-remake .remake-pass-toggle { bottom: 2px; }
body.strw-remake .login-actions { margin: 20px 0 10px; }
body.strw-remake .login-actions .btn { min-height: 46px; font-size: 15px; font-weight: 600; background: #ff7000; border-radius: 8px !important; }
body.strw-remake .login-field input[type='checkbox'] { appearance: auto; width: 16px; min-width: 16px; height: 16px; min-height: 16px; padding: 0; border-radius: 3px !important; }
body.strw-remake .login-field label.checkbox { gap: 8px; font-size: 12px; font-weight: 400; color: #c3cbd0; }
body.strw-remake #loginError:empty { display: none; }
body.strw-remake .public-support-actions { padding-top: 20px; margin: 24px 0 0; border-top: 1px solid rgba(217,229,235,.25); display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
body.strw-remake .public-support-actions .btn { background: transparent; border-color: rgba(218,230,235,.4); font-size: 11px; padding: 9px 7px; min-height: 42px; font-weight: 500; }
body.strw-remake .remake-login-benefits { grid-template-columns: repeat(5, minmax(0,1fr)); border: 0; margin: 0; padding: 0; gap: 0; }
body.strw-remake .remake-login-benefits span { border-right: 1px solid rgba(213,225,230,.35); font-size: 9px; color: #e0e6e9; padding: 0 3px; }
body.strw-remake .remake-login-benefits span:last-child { border: 0; }
body.auth-locked :is(.remake-bottom-nav, .prod-toolbox) { display: none !important; }
@media (min-width: 851px) and (max-width: 1100px) {
  body.strw-remake #loginOverlay { grid-template-columns: minmax(0, 1fr) 360px minmax(0, .6fr); gap: 18px; padding-inline: 22px; }
  body.strw-remake #loginOverlay .login-card { padding: 27px; }
  .remake-login-slogan { font-size: 21px; }
}
@media (max-width: 850px) {
  body.strw-remake #loginOverlay { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 36px 18px 24px; align-content: start; background-position: 72% center; background-attachment: fixed; }
  .remake-login-identity { grid-column: 1; max-width: 300px; }
  body.strw-remake .remake-login-brand img { width: 250px; }
  .remake-login-slogan { font-size: 20px; margin: 12px auto 0; }
  body.strw-remake #loginOverlay .login-card { grid-column: 1; width: min(440px,100%); padding: 26px 22px; margin: 0 auto; }
  body.strw-remake .remake-login-welcome h1 { font-size: 24px; }
  body.strw-remake .remake-login-benefits { display: none; }
  .remake-login-motto { right: 14px; top: 18px; font-size: 16px; }
  .remake-login-footer { position: relative; left: auto; bottom: auto; text-align: center; font-size: 10px; grid-column: 1; }
  .remake-login-footer span { display: block; margin: 5px 0 0; padding: 0; border: 0; }
  body.strw-remake .login-field input:not([type='checkbox']) { font-size: 16px; }
}

@media (min-width:851px) and (max-width:1350px) {
  body.strw-remake #app.ready { grid-template-columns:205px minmax(0,1fr) auto; }
  body.strw-remake .top-logo { width:205px; min-width:205px; }
  body.strw-remake #mainNav .nav-menu { flex-wrap:nowrap; }
  body.strw-remake #mainNav .remake-nav-direct:is([data-nav-tab='ausbildungsnachweis'],[data-nav-tab='projectdoc'],[data-nav-tab='streckenkarte'],[data-nav-tab='school'],[data-nav-tab='settings']) { display:none !important; }
  body.strw-remake #mainNav .remake-condensed-link { display:flex; gap:9px; }
  body.strw-remake #mainNav .remake-condensed-link svg { width:17px; height:17px; }
  .remake-search { width:44px; justify-content:center; }
  .remake-search span,.remake-search kbd,.remake-profile-copy { display:none; }
  .remake-profile { grid-template-columns:34px 14px; min-width:64px; }
}

/* Assignment keeps its live drag/drop board but uses the reference's toolbar and reading order. */
body.strw-remake .assign-page .assign-hero { margin-bottom:0 !important; border:0 !important; }
body.strw-remake .assign-page .assign-datebox { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; width:100%; margin:0 0 12px; padding:10px 16px; border:0; border-radius:0; background:#0b2632; box-shadow:none; }
body.strw-remake .assign-date-actions { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
body.strw-remake .assign-date-actions #assignDate { min-height:37px; width:225px; border-radius:5px; }
body.strw-remake .assign-date-actions .btn { min-height:37px; border-radius:5px !important; }
body.strw-remake .assign-date-actions :is(#assignPrev,#assignNext) { min-width:39px; padding:0; font-size:23px; line-height:1; }
body.strw-remake .assign-date-readable { font-size:13px; color:#d3e2e7; }
@media(min-width:1201px) {
  body.strw-remake .assign-board-wrap { grid-template-columns:minmax(205px,.24fr) minmax(490px,.95fr) minmax(345px,.68fr); }
  body.strw-remake .assign-absence-panel { order:-1; }
}
@media(max-width:700px) { body.strw-remake .assign-date-actions #assignDate { width:min(190px,calc(100vw - 165px)); } body.strw-remake .assign-datebox { padding:10px 12px; } }

body.strw-remake .an-panel { grid-template-columns:minmax(230px,.72fr) minmax(0,1.75fr) minmax(270px,.82fr); align-items:start; }
body.strw-remake .an-panel > .an-section { grid-column:auto; min-width:0; margin:0; }
body.strw-remake .an-panel > .an-section-person { grid-column:1; grid-row:1 / span 3; }
body.strw-remake .an-panel > .an-section-week { grid-column:2; grid-row:1 / span 3; min-height:390px; }
body.strw-remake .an-panel > .an-section-media { grid-column:3; grid-row:1; }
body.strw-remake .an-panel > .an-section-export { grid-column:3; grid-row:2; }
body.strw-remake .an-panel > .an-section-saved { grid-column:3; grid-row:3; }
.an-week-head { display:flex; align-items:center; justify-content:space-between; gap:8px; border-bottom:1px solid #35515e; padding-bottom:12px; margin-bottom:5px; }
body.strw-remake .an-week-head h3 { margin:0; font-size:17px; }
body.strw-remake .an-week-head h3::after { display:none; }
.an-week-head span { color:#67dfa6; font-size:12px; white-space:nowrap; }
.an-week-row { display:grid; grid-template-columns:64px minmax(0,1fr) 55px 28px; align-items:center; gap:10px; min-height:63px; border-bottom:1px solid #284652; padding:8px 2px; }
.an-week-row:last-child { border-bottom:0; }
.an-week-day { display:grid; justify-items:center; }
.an-week-day strong { font-size:16px; }
.an-week-day small { color:#b9cdd4; }
.an-week-description { min-width:0; display:grid; gap:3px; }
.an-week-description strong,.an-week-description small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.an-week-description strong { font-size:13px; }
.an-week-description small { color:#b9cdd4; font-size:11px; }
.an-week-hours { color:#c5d8de; font-size:12px; text-align:right; }
.an-week-row > button { border:0; background:transparent; color:white; font-size:22px; cursor:pointer; }
.an-week-row.filled { border-left:3px solid #36d797; }
@media(max-width:1100px) { body.strw-remake .an-panel { grid-template-columns:minmax(220px,.75fr) minmax(0,1.75fr); } body.strw-remake .an-panel > .an-section-person { grid-column:1; grid-row:1; } body.strw-remake .an-panel > .an-section-week { grid-column:2; grid-row:1 / span 3; } body.strw-remake .an-panel > :is(.an-section-media,.an-section-export,.an-section-saved) { grid-column:1; grid-row:auto; } }
@media(max-width:700px) { body.strw-remake .an-panel { display:grid; grid-template-columns:1fr; } body.strw-remake .an-panel > .an-section { grid-column:1 !important; grid-row:auto !important; } body.strw-remake .an-panel > .an-section-week { min-height:0; } }

/* Dashboard: operational panels first, legacy tools remain one click away. */
@media(min-width:1101px) {
  body.strw-remake .dash-v11 .dash-head .title { max-width:850px; }
  body.strw-remake .dash-v11 .dash-head h2 { font-size:clamp(2.25rem,3vw,3.25rem) !important; }
  body.strw-remake .dash-v11 .dash-standby-card { grid-column:1; grid-row:1; }
  body.strw-remake .dash-v11 .dash-chat-card { grid-column:2; grid-row:1; }
  body.strw-remake .dash-v11 #dashReportsCard { grid-column:3; grid-row:1; }
  body.strw-remake .dash-v11 .remake-tools-card { grid-column:1 / -1; grid-row:2; }
}
body.strw-remake .dash-v11 .remake-tools-card .dcard-body { display:none; }
body.strw-remake .dash-v11 .remake-tools-card.remake-tools-expanded .dcard-body { display:block; }
body.strw-remake .dash-v11 .remake-kpi-link b { font-size:1.45rem; line-height:1; }
body.strw-remake .dash-v11 .remake-kpi-link small { font-size:.74rem; line-height:1.3; }
@media(min-width:851px) {
  body.strw-remake #mainNav .remake-nav-more:not(.open) > .dropdown { display:none !important; }
}
@media(max-width:700px) {
  body.strw-remake .repTopLeft { min-width:0 !important; width:100%; }
  body.strw-remake .repActionsRow { width:100%; margin-top:12px !important; }
  body.strw-remake .repActionsBox { width:100%; display:grid !important; grid-template-columns:1fr 1fr; gap:8px !important; padding:0 !important; background:none !important; border:0 !important; box-shadow:none !important; }
  body.strw-remake .repMenuWrap,
  body.strw-remake #repMoreBtn,
  body.strw-remake #repNew { width:100%; min-width:0; min-height:40px; }
  body.strw-remake .repCalendarToolbar { flex-wrap:wrap; }
  body.strw-remake .repCalendarToolbar h3 { flex:1 0 100%; }
  body.strw-remake .repCalendarModes { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  body.strw-remake .repCalendarModes button { min-width:0; padding-inline:5px; }
}
@media(max-width:700px) {
  body.strw-remake .assign-page .assign-datebox { align-items:flex-start; padding:10px 12px; }
  body.strw-remake .assign-date-actions { width:100%; flex-direction:row; flex-wrap:nowrap; gap:6px; }
  body.strw-remake .assign-date-actions #assignDate { flex:1 1 auto; width:auto; min-width:0; }
  body.strw-remake .assign-date-actions :is(#assignPrev,#assignNext) { flex:0 0 38px; }
  body.strw-remake .assign-date-actions #assignToday { flex:0 0 auto; padding-inline:8px; }
  body.strw-remake .assign-date-readable { width:100%; padding-left:2px; }
  body.strw-remake .assign-board-wrap { overflow:visible; }
  body.strw-remake .assign-district-board { min-width:0 !important; grid-template-columns:80px repeat(2,minmax(0,1fr)); }
  body.strw-remake .assign-district-label { overflow-wrap:anywhere; padding:5px; font-size:11px; }
  body.strw-remake .assign-board-head { overflow-wrap:anywhere; padding:5px; font-size:11px; }
  body.strw-remake .assign-global-board { grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:10px; }
  body.strw-remake .assign-absence-panel { margin-top:10px; }
  body.strw-remake .assign-dropzone { padding:4px; }
  body.strw-remake:has(.wr-page) #prodQuick { display:none; }
}
body.strw-remake .fleet-filter-head > div { display:flex; gap:8px; }
body.strw-remake [data-fleet-filter-toggle] { display:none; }
@media(max-width:700px) {
  body.strw-remake [data-fleet-filter-toggle] { display:inline-flex; }
  body.strw-remake .fleet-browser.fleet-filters-collapsed .fleet-filters > :not(.fleet-filter-head) { display:none; }
  body.strw-remake .fleet-filters { grid-template-columns:1fr; }
  body.strw-remake .fleet-filter-head { grid-column:1; }
  body.strw-remake .vehicle-page { display:block !important; }
  body.strw-remake .vehicle-page [data-vehicle-panel],
  body.strw-remake .fleet-browser,
  body.strw-remake .fleet-content,
  body.strw-remake .fleet-results { width:100%; min-width:0; max-width:100%; }
  body.strw-remake .fleet-content { display:block; }
  body.strw-remake .fleet-filters { margin-bottom:12px; }
  body.strw-remake .fleet-filter-head > div { flex-wrap:wrap; justify-content:flex-end; }
  body.strw-remake .an-hero h2 { font-size:26px; overflow-wrap:anywhere; }
  body.strw-remake .an-week-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
  body.strw-remake .an-week-actions .btn { min-width:0; padding-inline:6px; }
  body.strw-remake .vacation-page .cal-remake-main { order:-1; }
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  body.strw-remake .dash-v11 .kpi { min-height:104px; padding:10px !important; }
  body.strw-remake .dash-v11 .kpi.weather .k-weather { align-items:flex-start; }
  body.strw-remake .dash-v11 .kpi.weather #wxHint { font-size:.64rem; }
  body.strw-remake .dash-v11 .dash-assignment-kpi { grid-column:1/-1; }
  body.strw-remake .dash-v11 .remake-kpi-link b { font-size:1.25rem; }
}
@media(min-width:851px) {
  body.strw-remake .dash-v11 .kpi-strip { grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); }
}
body.strw-remake #mainContent .kmcalc {
  width:min(720px,calc(100% - 36px));
  margin:18px;
  padding:18px;
  border:1px solid var(--strw-line);
  border-radius:7px;
  background:var(--strw-panel);
}
body.strw-remake #mainContent .kmcalc h2 { margin:0 0 8px; color:#f4f8f9; font-size:1.25rem; }
body.strw-remake #mainContent .kmcalc p { margin:0 0 14px; color:#bdced4; }
body.strw-remake #mainContent .kmcalc .form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.strw-remake #mainContent .kmcalc label { display:grid; gap:6px; min-width:0; }
body.strw-remake #mainContent .kmcalc input { width:100%; min-width:0; }
body.strw-remake #mainContent .kmcalc #calcKm { margin-top:14px; border-color:var(--strw-orange); background:var(--strw-orange); color:#fff; }
body.strw-remake #mainContent .kmcalc #kmResult p { color:#f1f6f7; margin:14px 0 0; }
@media(max-width:700px) {
  body.strw-remake #mainContent .kmcalc { width:calc(100% - 20px); margin:10px; padding:14px; }
  body.strw-remake #mainContent .kmcalc .form-grid { grid-template-columns:1fr; }
}
body.strw-remake .dash-v11 :is(#siteNoticeHost,#chatDashboardNotice):empty { display:none; }
body.strw-remake #mainContent.page-entering { animation:strwPageFade var(--ui-normal) var(--ui-ease) both; }
@keyframes strwPageFade { from { opacity:0; } to { opacity:1; } }
body.strw-remake #mainContent { transform:none !important; }
@media (min-width: 851px) {
  body.strw-remake .top-logo {
    width: 100% !important;
    min-width: 0 !important;
  }
  body.strw-remake :is(.top-logo, #mainNav, .remake-header-tools) {
    background: #0f172a !important;
  }
}
body.strw-remake .sup-modal-bg { padding:12px; }
body.strw-remake .repCalendarGrid {
  grid-template-columns: repeat(7, minmax(0, 1fr)) minmax(82px, .65fr);
}
body.strw-remake .repCalendarDay {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 132px;
  padding: 6px;
}
body.strw-remake .repCalendarDate { flex: 0 0 26px; margin: 0; }
body.strw-remake .repCalendarDay.empty-action { cursor: pointer; }
body.strw-remake .repCalendarDay.empty-action:hover,
body.strw-remake .repCalendarDay.empty-action:focus-visible { background: rgba(255, 115, 21, .1); outline: 2px solid var(--strw-orange); outline-offset: -2px; }
body.strw-remake .repCalendarEntry {
  --entry-color: #37dc91;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-height: 76px;
  margin: 0;
  padding: 8px;
  border-radius: 5px;
  background: var(--entry-color);
  color: #09212a;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
body.strw-remake .repCalendarEntry.school { --entry-color: #ffd34a; background: var(--entry-color); }
body.strw-remake .repCalendarEntry.urlaub { --entry-color: #3a9fff; background: var(--entry-color); color: #09212a; }
body.strw-remake .repCalendarEntry.krank { --entry-color: #ff6868; background: var(--entry-color); color: #09212a; }
body.strw-remake .repCalendarEntry.weekend { --entry-color: #a7bcc9; background: var(--entry-color); }
body.strw-remake .repCalendarEntry.has-standby {
  background: linear-gradient(110deg, var(--entry-color) 0 55%, #ff892b 55% 100%);
}
.repCalendarEntryTitle { font-size: .78rem; font-weight: 850; }
.repCalendarEntryLead { font-size: .67rem; font-weight: 650; }
.repCalendarEntryHours { margin-top: auto; font-size: .75rem; font-weight: 900; }
.repCalendarEntryStandby { font-size: .65rem; font-weight: 800; }
.repCalendarWeekTotal { display: grid; place-items: center; min-width: 0; padding: 8px; border-right: 1px solid var(--strw-line); border-bottom: 1px solid var(--strw-line); color: #eaf2f4; text-align: center; }
.repCalendarWeekTotal strong { font-size: .84rem; white-space: nowrap; }
.repCalendarLegend .standby::before { background: linear-gradient(110deg, #37dc91 0 55%, #ff892b 55% 100%); }
@media (max-width: 900px) {
  body.strw-remake .repCalendarOverview { overflow-x: auto; }
  body.strw-remake .repCalendarGrid { min-width: 920px; }
}
body.strw-remake .sup-modal { width:min(680px,100%); max-height:calc(100dvh - 24px); display:flex; flex-direction:column; border-radius:8px; }
body.strw-remake .sup-modal-body { min-height:0; overflow-y:auto; }
body.strw-remake .settings-wrap .set-check { min-width:0; max-width:100%; }
body.strw-remake .settings-wrap .set-check > span { min-width:0; overflow-wrap:anywhere; }
@media(max-width:950px) {
  body.strw-remake .vacation-page .cal-remake-main { order:-1; }
  body.strw-remake .vacation-page .cal-today-btn { align-self:start; max-height:44px; }
}
@media(min-width:701px) and (max-width:950px) {
  body.strw-remake .vacation-page .cal-remake-main .cal-weekdays { display:grid !important; }
  body.strw-remake .vacation-page .cal-remake-main .cal-grid { grid-template-columns:repeat(7,minmax(0,1fr)) !important; }
  body.strw-remake .vacation-page .cal-remake-main .cal-empty { display:flex !important; }
  body.strw-remake .vacation-page .cal-remake-main .cal-cell { min-height:76px; padding:4px; }
}
body.strw-remake .prod-toolbox { display:none; }
@media(max-width:850px) {
  body.strw-remake .remake-search { display:grid; place-items:center; width:36px; min-width:36px; min-height:38px; padding:0; border:0; background:transparent; }
  body.strw-remake .remake-search :is(span,kbd) { display:none !important; }
  body.strw-remake .remake-head-icon { display:grid; width:36px; min-width:36px; min-height:38px; }
  body.strw-remake .remake-header-tools { gap:2px; padding-inline:2px 8px; }
  body.strw-remake .remake-profile { min-width:38px; }
  body.strw-remake .prod-toolbox { display:flex; bottom:calc(82px + env(safe-area-inset-bottom)); }
  body.strw-remake .prod-toolbox :is(#prodSearch,#prodNotifications) { display:none; }
body.strw-remake:not(:has(.repOverviewBody)) .prod-toolbox { display:none; }
}
@media(max-width:700px) {
  body.strw-remake .vacation-page .cal-remake-main .cal-grid .cal-empty { display:flex !important; }
  body.strw-remake .settings-nav { flex-wrap:wrap; overflow:visible; gap:4px; }
  body.strw-remake .settings-nav-item { flex:1 1 95px; min-width:0; padding:8px 6px; text-align:center; }
  body.strw-remake #workTable { display:block; width:100% !important; padding:0; overflow:hidden; }
  body.strw-remake #workTable thead { display:none; }
  body.strw-remake #workTable tbody { display:block; }
  body.strw-remake #workTable tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 12px; padding:12px; border-bottom:1px solid var(--strw-line) !important; }
  body.strw-remake #workTable tr:last-child { border-bottom:0 !important; }
  body.strw-remake #workTable td { display:grid; min-width:0; padding:0 !important; gap:4px; border:0; }
  body.strw-remake #workTable td:first-child { grid-column:1/-1; font-weight:850; color:#fff; }
  body.strw-remake #workTable td:not(:first-child)::before { content:attr(data-label); color:#b8ccd2; font-size:11px; font-weight:750; }
  body.strw-remake #workTable td :is(input,.hoursOut) { width:100% !important; min-width:0; }
}

/* Report surfaces use the same translucent treatment as the login panel. */
body.strw-remake:has(.repOverviewBody, .wr-page) #app {
  background: linear-gradient(rgba(1, 17, 23, .88), rgba(1, 17, 23, .92)), url('../assets/design-remake/hero-office.webp') center / cover fixed !important;
}
body.strw-remake :is(.repTopBar, .repCalendarOverview, .repStatPanel, .wr-page > .wr-top, .wr-page .wr-card) {
  border-color: rgba(207, 225, 231, .28) !important;
  background: rgba(9, 28, 37, .86) !important;
  box-shadow: 0 16px 42px rgba(0, 7, 10, .22) !important;
  -webkit-backdrop-filter: blur(16px) saturate(120%);
  backdrop-filter: blur(16px) saturate(120%);
}
body.strw-remake .repCalendarDay.weekend { background: rgba(255, 255, 255, .035); }
body.strw-remake .wr-page > .wr-top { z-index: 200 !important; }
body.strw-remake .wrveh-overlay {
  background: rgba(1, 13, 18, .58) !important;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
body.strw-remake .wrveh-modal {
  border-color: rgba(207, 225, 231, .3) !important;
  background: rgba(9, 28, 37, .86) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .42) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}
body.strw-remake .wrveh-item { background: rgba(255, 255, 255, .055); }