:root {
  color-scheme: light;
  --ink: #4d4d4d;
  --muted: #707b86;
  --line: #e3e6e8;
  --soft: #f4f5f6;
  --paper: #ffffff;
  --brand: #2f3742;
  --brand-2: #3b4653;
  --accent: #5d91d0;
  --danger: #d26a63;
  --success: #46bd87;
  --warning: #e5ad3c;
  --shadow: 0 3px 12px rgba(34, 43, 54, .09);
  font-family: "Segoe UI", Arial, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; background: #f6f6f6; color: var(--ink); }
body { overflow-x: hidden; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(93, 145, 208, .35); outline-offset: 2px; }
a { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: .45rem; font-size: clamp(1.55rem, 3vw, 2.05rem); font-weight: 400; letter-spacing: -.02em; }
h2 { font-size: 1.18rem; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.eyebrow { margin-bottom: .55rem; color: var(--accent); font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.mono { font-family: "SFMono-Regular", Consolas, monospace; }

.login { min-height: 100vh; display: grid; grid-template-columns: minmax(320px, 1fr) minmax(360px, 520px); background: var(--brand); }
.login__story { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; padding: clamp(2rem, 6vw, 6rem); overflow: hidden; color: #f6f8fb; }
.login__story::before, .login__story::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }
.login__story::before { width: 38rem; height: 38rem; top: -17rem; right: -10rem; }
.login__story::after { width: 24rem; height: 24rem; bottom: -11rem; left: -8rem; }
.brand { position: relative; z-index: 1; display: flex; align-items: center; gap: .9rem; font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; }
.brand__mark { width: 2.7rem; height: 2.7rem; display: grid; place-items: center; border-radius: 50%; background: var(--accent); color: #fff; font-weight: 800; }
.login__headline { position: relative; z-index: 1; max-width: 690px; margin: 3rem 0; font-size: clamp(2.2rem, 5.3vw, 5rem); line-height: .98; letter-spacing: -.065em; }
.login__features { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: .75rem; }
.login__features span { padding: .65rem .85rem; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; background: rgba(255,255,255,.06); font-size: .88rem; }
.login__panel { min-height: 100vh; display: grid; place-items: center; padding: 2rem; background: #f6f7f8; }
.login__card { width: min(100%, 390px); }
.login__card h1 { font-size: 2rem; }
.credentials { margin: 1rem 0 1.25rem; padding: .9rem; border: 1px solid #d9e4df; border-radius: .85rem; background: #fff; font-size: .83rem; line-height: 1.55; }

.field { display: grid; gap: .4rem; margin-bottom: .9rem; }
.field > span, .field > label { font-size: .83rem; font-weight: 750; }
.field small { color: var(--muted); }
input, select, textarea { width: 100%; min-height: 40px; padding: .62rem .7rem; border: 1px solid #d6dadd; border-radius: 2px; background: #fff; color: var(--ink); }
textarea { min-height: 90px; resize: vertical; }
input[type="checkbox"], input[type="radio"] { width: 1.1rem; min-height: 1.1rem; accent-color: var(--brand-2); }
.check { display: flex; align-items: center; gap: .55rem; min-height: 40px; font-size: .9rem; }
.check input { flex: 0 0 auto; }
.error { min-height: 1.25rem; color: var(--danger); font-size: .85rem; }

.btn { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .52rem .8rem; border: 0; border-radius: 2px; background: var(--accent); color: #fff; font-weight: 600; cursor: pointer; text-decoration: none; transition: background .15s ease; }
.btn:hover { background: #4c82c3; }
.btn:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.btn--wide { width: 100%; }
.btn--soft { border: 1px solid #d9dde1; background: #fff; color: #5d6772; }
.btn--soft:hover { background: #f2f4f6; }
.btn--accent { background: #46bd87; color: #fff; }
.btn--accent:hover { background: #38aa78; }
.btn--danger { background: #f9e9e7; color: var(--danger); }
.btn--icon { min-width: 42px; padding-inline: .7rem; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }

.shell { min-height: 100vh; display: grid; grid-template-columns: 228px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 0 0 1rem; overflow: auto; background: var(--brand); color: #9da7b2; }
.sidebar .brand { min-height: 61px; padding: .65rem 1rem; border-bottom: 1px solid rgba(255,255,255,.07); color: #fff; font-size: .88rem; line-height: 1.05; text-transform: uppercase; }
.sidebar .brand__mark { width: 2.25rem; height: 2.25rem; border: 2px solid #fff; border-radius: 50%; background: transparent; color: #fff; font-size: .75rem; }
.sidebar nav { padding: .65rem 0; }
.nav-section { display: none; }
.nav-link { width: 100%; min-height: 39px; display: flex; align-items: center; gap: .65rem; margin: 0; padding: .55rem 1.1rem; border: 0; border-radius: 0; background: transparent; color: inherit; cursor: pointer; font-size: .88rem; text-align: left; }
.nav-link:hover, .nav-link.active { background: #28303a; color: #fff; }
.nav-link.active { border-left: 3px solid var(--accent); padding-left: calc(1.1rem - 3px); }
.nav-link__icon { width: 1.4rem; font-size: 1.05rem; text-align: center; }
.workspace { min-width: 0; }
.topbar { position: sticky; z-index: 20; top: 0; min-height: 61px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem clamp(1rem, 3vw, 3.35rem); border-bottom: 1px solid #eceeef; background: rgba(255,255,255,.96); box-shadow: 0 1px 3px rgba(30,40,50,.04); }
.topbar__title { color: var(--accent); font-size: 1.65rem; font-weight: 300; }
.topbar__right { display: flex; align-items: center; gap: .7rem; }
.avatar { width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border: 1px solid #e1e4e7; border-radius: 2px; background: #fafafa; color: #a0a7ae; font-size: .75rem; font-weight: 700; }
.mobile-menu { display: none; }
.main { width: min(1540px, 100%); margin: 0 auto; padding: clamp(1.4rem, 3vw, 3.35rem); }
.page-head { min-height: 36px; display: flex; align-items: center; justify-content: flex-end; gap: 1rem; margin-bottom: 1rem; }
.page-head > div:first-child { display: none; }
.page-head p { max-width: 680px; margin-bottom: 0; color: var(--muted); }

.grid { display: grid; gap: 1rem; }
.grid > * { min-width: 0; }
.grid--metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.metric, .card { border: 0; border-radius: 1px; background: var(--paper); box-shadow: var(--shadow); }
.metric { position: relative; min-height: 120px; padding: 1rem; overflow: hidden; }
.metric::after { display: none; }
.metric__label { color: #6f9ccf; font-size: .94rem; font-weight: 400; }
.metric__value { margin-top: .55rem; color: #42484e; font-size: 1.85rem; font-weight: 600; letter-spacing: -.025em; }
.metric__hint { margin-top: .25rem; color: var(--success); font-size: .78rem; }
.card { padding: 1.05rem; }
.card--flush { padding: 0; overflow: hidden; }
.card__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.card__head h2 { margin: 0; }
.stack { display: grid; gap: .75rem; }
.list-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem; border: 1px solid var(--line); border-radius: .75rem; background: #fff; }
.list-row__main { min-width: 0; }
.list-row__title { font-weight: 750; }
.list-row__meta { margin-top: .2rem; color: var(--muted); font-size: .8rem; }
.score { min-width: 3.25rem; padding: .4rem .55rem; border-radius: .6rem; background: #e3f2eb; color: var(--success); font-weight: 850; text-align: center; }
.score.bad { background: #f9e7e5; color: var(--danger); }
.empty { padding: 2.5rem 1rem; color: var(--muted); text-align: center; }

.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-bottom: 1rem; }
.toolbar .search { min-width: min(250px, 100%); max-width: 340px; margin-left: auto; }
.period-filter { width: 220px; min-height: 36px; }
.no-access { max-width: 620px; margin: 12vh auto; text-align: center; }
.table-wrap { overflow: auto; border: 1px solid #e1e4e7; border-radius: 0; background: #fff; box-shadow: none; }
table { width: 100%; border-collapse: collapse; font-size: .86rem; }
th, td { height: 42px; padding: .62rem .85rem; border-right: 1px solid #e4e7e9; border-bottom: 1px solid #e4e7e9; text-align: left; vertical-align: middle; }
th:last-child, td:last-child { border-right: 0; }
th { position: sticky; top: 0; background: #f9f9f9; color: #8b939a; font-size: .8rem; font-weight: 400; letter-spacing: 0; text-transform: none; }
tr:last-child td { border-bottom: 0; }
.row-actions { display: flex; gap: .4rem; justify-content: flex-end; }
.icon-action { min-width: 30px; min-height: 30px; display: inline-grid; place-items: center; border: 0; border-radius: 2px; background: var(--accent); color: #fff; cursor: pointer; }
.icon-action:hover { background: #4c82c3; }
.icon-action--run { background: var(--success); }
.badge { display: inline-flex; align-items: center; gap: .3rem; padding: .32rem .55rem; border-radius: 999px; background: #e7f2ed; color: var(--success); font-size: .75rem; font-weight: 800; }
.badge--gray { background: #edf1ef; color: #687d77; }
.badge--warn { background: #fbefdd; color: #9a641f; }
.badge--danger { background: #fae8e6; color: var(--danger); }

.modal-backdrop { position: fixed; z-index: 60; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgba(15, 40, 35, .55); backdrop-filter: blur(4px); }
.modal { width: min(720px, 100%); max-height: min(850px, 92vh); overflow: auto; padding: 1.25rem; border-radius: 2px; background: #fff; box-shadow: 0 30px 80px rgba(8,28,24,.25); }
.modal--large { width: min(980px, 100%); }
.modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.modal__head h2 { margin: 0; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1rem; }
.form-grid .field { margin: 0; }
.span-2 { grid-column: 1 / -1; }
.divider { height: 1px; margin: 1rem 0; background: var(--line); }

.template-card { display: flex; flex-direction: column; min-height: 230px; padding: 1.1rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; box-shadow: var(--shadow); }
.template-card__tag { align-self: flex-start; margin-bottom: 1rem; }
.template-card h2 { margin-bottom: .45rem; }
.template-card p { flex: 1; color: var(--muted); font-size: .86rem; line-height: 1.5; }
.template-card__stats { display: flex; gap: 1rem; margin: .8rem 0; font-size: .78rem; color: var(--muted); }
.template-editor__block { margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: .9rem; background: #f8faf9; }
.template-editor__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem; margin-top: .65rem; padding: .75rem; border-radius: .7rem; background: #fff; }
.template-editor__options { display: flex; flex-wrap: wrap; gap: .75rem; grid-column: 1 / -1; }
.workplace-rooms { display: grid; gap: 12px; padding: 15px; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-cream); }
.workplace-rooms > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.workplace-rooms > header > div { display: grid; gap: 3px; }
.workplace-rooms > header strong { color: var(--tb-ink); font-size: .88rem; }
.workplace-rooms > header small { color: var(--tb-muted); font-size: .72rem; }
.workplace-rooms__list { display: grid; gap: 8px; }
.workplace-room { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 8px; }
.workplace-room input { min-width: 0; width: 100%; }
.workplace-room__remove { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--tb-control-line); border-radius: 11px; background: var(--tb-paper); color: var(--tb-danger); cursor: pointer; }
.workplace-room__remove:hover { border-color: var(--tb-danger); background: #FFF7F5; }
.workplace-room__remove .ui-icon { width: 18px; height: 18px; }
.workplace-room-summary { min-width: 180px; display: grid; gap: 3px; }
.workplace-room-summary strong { color: var(--tb-ink); font-size: .78rem; }
.workplace-room-summary small { max-width: 360px; overflow: hidden; color: var(--tb-muted); font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.workplace-room-summary--empty { color: var(--tb-muted); font-size: .78rem; }
.workplace-order { min-width: 118px; display: flex; align-items: center; gap: 10px; }
.workplace-order > strong { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 28px; border-radius: 50%; background: var(--tb-dark); color: #fff; font-size: .72rem; }
.workplace-order > span { display: flex; gap: 5px; }
.workplace-order button { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--tb-control-line); border-radius: 10px; background: var(--tb-paper); color: var(--tb-ink); cursor: pointer; font: inherit; font-size: 1rem; }
.workplace-order button:hover:not(:disabled) { border-color: var(--tb-gold); background: var(--tb-warm); }
.workplace-order button:focus-visible { outline: 3px solid rgba(186, 155, 79, .32); outline-offset: 2px; }
.workplace-order button:disabled { opacity: .35; cursor: default; }

.inspection-picker { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 1rem; }
.mobile-preview { max-width: 460px; min-height: 680px; margin: 0 auto; overflow: hidden; border: 10px solid #17332e; border-radius: 2rem; background: #f6f8f6; box-shadow: 0 24px 70px rgba(20,52,45,.2); }
.mobile-preview__head { padding: 1.2rem 1rem 1rem; background: var(--brand); color: #fff; }
.mobile-preview__head h2 { margin: .35rem 0 0; font-size: 1.25rem; }
.progress { height: .45rem; overflow: hidden; border-radius: 999px; background: #dfe9e5; }
.progress > span { display: block; height: 100%; border-radius: inherit; background: var(--accent); transition: width .2s; }
.mobile-preview__body { padding: 1rem; }
.question { padding: 1rem; border: 1px solid var(--line); border-radius: .9rem; background: #fff; }
.question__count { color: var(--muted); font-size: .74rem; font-weight: 800; }
.question h3 { margin: .5rem 0 1rem; font-size: 1.08rem; line-height: 1.4; }
.answer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.answer { min-height: 52px; border: 1px solid var(--line); border-radius: .75rem; background: #fff; color: var(--ink); font-weight: 800; cursor: pointer; }
.answer.active[data-value="yes"] { border-color: var(--success); background: #e4f3ec; color: var(--success); }
.answer.active[data-value="no"] { border-color: var(--danger); background: #fae9e7; color: var(--danger); }
.answer.active[data-value="skip"] { background: #edf1ef; color: var(--muted); }
.photo-control { display: block; margin-top: .75rem; padding: .75rem; border: 1px dashed #b8ccc5; border-radius: .7rem; color: var(--brand-2); font-size: .82rem; font-weight: 750; text-align: center; cursor: pointer; }
.photo-control input { display: none; }
.photo-preview { width: 100%; max-height: 180px; margin-top: .75rem; object-fit: cover; border-radius: .7rem; }
.inspection-nav { display: flex; justify-content: space-between; gap: .6rem; margin-top: 1rem; }

.kanban { display: grid; grid-template-columns: repeat(3, minmax(260px, 1fr)); gap: 1rem; overflow-x: auto; }
.kanban__column { min-height: 360px; padding: .8rem; border-radius: 1rem; background: #e8efec; }
.kanban__head { display: flex; justify-content: space-between; padding: .4rem .3rem .8rem; font-size: .82rem; font-weight: 850; }
.task-card { margin-bottom: .65rem; padding: .85rem; border: 1px solid var(--line); border-radius: .8rem; background: #fff; box-shadow: 0 6px 18px rgba(20,52,45,.06); }
.task-card__title { font-weight: 780; }
.task-card__meta { margin: .5rem 0; color: var(--muted); font-size: .76rem; line-height: 1.5; }

.bar-chart { display: grid; gap: .75rem; }
.bar { display: grid; grid-template-columns: minmax(110px, 1fr) 3fr 45px; align-items: center; gap: .75rem; font-size: .82rem; }
.bar__track { height: .65rem; overflow: hidden; border-radius: 999px; background: #e6eeeb; }
.bar__fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--brand-2), #70a890); }

.toast { position: fixed; z-index: 100; right: 1.2rem; bottom: 1.2rem; max-width: min(390px, calc(100vw - 2rem)); padding: .9rem 1rem; border-radius: 2px; background: #2f3742; color: #fff; box-shadow: 0 16px 50px rgba(14,42,36,.25); }
.table-note { display: block; max-width: 520px; margin-top: .2rem; overflow: hidden; color: #8b939a; font-size: .75rem; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.status-check { color: var(--success); font-weight: 600; }
.status-cross { color: #8b939a; }
.toast.error { background: #8f3e39; }

@media (max-width: 1100px) {
  .grid--metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inspection-picker { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .login { grid-template-columns: 1fr; }
  .login__story { min-height: 38vh; padding: 1.5rem; }
  .login__headline { margin: 2.2rem 0; font-size: clamp(2.3rem, 11vw, 4rem); }
  .login__panel { min-height: 62vh; padding: 1.5rem; }
  .shell { grid-template-columns: 1fr; }
  .sidebar { position: fixed; z-index: 50; inset: 0 auto 0 0; width: min(85vw, 300px); transform: translateX(-105%); transition: transform .2s ease; box-shadow: 15px 0 50px rgba(5,24,20,.2); }
  .sidebar.open { transform: translateX(0); }
  .mobile-menu { display: inline-flex; }
  .topbar { min-height: 62px; }
  .topbar__user { display: none; }
  .page-head { align-items: stretch; flex-direction: column; }
  .grid--3, .grid--2 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .modal { max-height: 94vh; padding: 1rem; }
  .mobile-preview { min-height: 650px; border-width: 0; border-radius: 1rem; }
}

@media (max-width: 560px) {
  .main { padding: 1rem .75rem 5rem; }
  .grid--metrics { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .metric { min-height: 120px; padding: .9rem; }
  .metric__value { font-size: 1.6rem; }
  .template-card { min-height: 0; }
  .bar { grid-template-columns: 90px 1fr 38px; }
  .answer-grid { grid-template-columns: 1fr; }
  .inspection-nav .btn { flex: 1; }
  th, td { padding: .75rem; }
}

/* Visual parity layer: Service Inspector administrative shell */
:root {
  --brand: #1d2831;
  --brand-2: #303946;
  --accent: #5d91cf;
  --line: #dfe2e5;
  --soft: #f4f4f4;
  --ink: #50555a;
  --muted: #8a9299;
  --shadow: 0 2px 10px rgba(37, 47, 57, .08);
  font-family: "Roboto Condensed", "Arial Narrow", "Segoe UI", Arial, sans-serif;
}

html, body { background: #f5f5f5; color: #53585d; }
.shell { grid-template-columns: 230px minmax(0, 1fr); }
.sidebar { background: #1d2831; color: #84909a; }
.brand--sidebar { min-height: 61px !important; gap: .75rem !important; padding: .65rem 1rem !important; border-bottom: 0 !important; background: #303844; }
.brand--sidebar .brand__mark { width: 36px; height: 36px; border: 3px solid #d6dadd; border-radius: 50%; color: #d6dadd; font-size: 1.25rem; transform: rotate(-10deg); }
.brand__copy { color: #eef0f2; font-size: .76rem; font-weight: 800; line-height: .92; letter-spacing: .02em; }
.sidebar nav { padding: 17px 0 0; }
.nav-link { min-height: 40px; gap: .6rem; padding: .55rem 1.18rem; color: #84909a; font-size: .86rem; font-weight: 400; letter-spacing: -.01em; text-decoration: none; }
.nav-link:hover, .nav-link.active { border-left: 0; padding-left: 1.18rem; background: transparent; color: #f2f4f5; }
.nav-link.active { color: #f2f4f5; }
.nav-link__icon { width: 1.15rem; color: #697782; font-size: .92rem; }
.nav-link.active .nav-link__icon { color: #f2f4f5; }
.nav-group { margin: 0; }
.nav-group summary { list-style: none; }
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary { cursor: pointer; }
.nav-chevron { margin-left: auto; transition: transform .18s ease; }
.nav-group[open] .nav-chevron { transform: rotate(-90deg); }
.nav-group .nav-link--nested { min-height: 34px; padding: .38rem 1rem .38rem 3rem; font-size: .79rem; }
.nav-group .nav-link--nested:hover, .nav-group .nav-link--nested.active { padding-left: 3rem; background: #182129; }
.workspace { min-height: 100vh; display: flex; flex-direction: column; }
.topbar { position: sticky; min-height: 61px; padding: 0 30px; border-bottom: 1px solid #e7e8ea; background: #fff; box-shadow: 0 2px 10px rgba(31, 43, 54, .04); }
.topbar__left { display: flex; align-items: center; gap: 14px; }
.topbar__menu { width: 30px; height: 30px; border: 0; border-radius: 0; background: #f0f1f2; color: #50555a; font-size: 1.25rem; line-height: 1; cursor: pointer; }
.topbar__title { color: #5d91cf; font-size: 1.8rem; font-weight: 300; }
.user-menu { position: relative; }
.user-menu summary { display: flex; align-items: center; gap: .45rem; list-style: none; cursor: pointer; }
.user-menu summary::-webkit-details-marker { display: none; }
.avatar { width: 35px; height: 35px; border: 1px solid #e3e5e7; border-radius: 0; background: #fafafa; color: #b7bdc2; font-size: 1rem; }
.user-menu__arrow { color: #747c83; font-size: .72rem; }
.user-menu__panel { position: absolute; z-index: 30; top: 44px; right: 0; width: 245px; display: grid; gap: .25rem; padding: .9rem; border: 1px solid #e1e4e7; background: #fff; box-shadow: var(--shadow); }
.user-menu__panel strong, .user-menu__panel small { display: block; overflow: hidden; text-overflow: ellipsis; }
.user-menu__panel small { margin-bottom: .45rem; color: var(--muted); }
.user-menu__panel button { min-height: 34px; border: 0; background: #f5f6f7; color: #525960; cursor: pointer; text-align: left; }
.main { width: 100%; max-width: none; flex: 1; padding: 64px 72px 42px 55px; }
.page-head { min-height: 38px; margin-bottom: 13px; }
.page-head:has(.button-row:empty) { display: none; }
.btn { min-height: 31px; padding: .42rem .72rem; border-radius: 0; background: #5d91cf; font-size: .82rem; font-weight: 600; }
.btn--soft { border-color: #dadde0; background: #fff; color: #59616a; }
.btn--soft:hover { background: #f4f5f6; }
.list-toolbar { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 12px; }
.list-toolbar__right { display: flex; align-items: center; gap: 11px; margin-left: auto; }
.list-toolbar .search { width: 200px; min-height: 33px; border-width: 0 0 1px; background: transparent; }
.check { min-height: 32px; color: #737b82; font-size: .88rem; font-weight: 400; }
input[type="checkbox"], input[type="radio"] { accent-color: #5d91cf; }
.table-wrap { border: 1px solid #dfe2e5; background: #fff; }
table { color: #54595e; font-size: .89rem; }
th, td { height: 42px; padding: .7rem 1.12rem; border-color: #dfe2e5; }
th { position: static; background: #f7f7f7; color: #737b82; font-size: .88rem; font-weight: 400; }
tbody td { height: 79px; }
tbody strong { font-weight: 400; }
.table-note { margin-top: .25rem; color: #92999f; }
.row-actions { min-width: 52px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.icon-action { width: 23px; min-width: 23px; height: 23px; min-height: 23px; padding: 0; border-radius: 0; background: #4f86c7; font-size: .72rem; }
.icon-action--run { background: #46ad7b; }
.status-check { color: #3daf78; font-size: 1.1rem; }
.record-footer { display: flex; justify-content: space-between; padding: 11px 2px; color: #8c9399; font-size: .78rem; }
.report-filter { display: grid; grid-template-columns: repeat(5, minmax(130px, 1fr)) auto; align-items: end; gap: .7rem; margin: 0 0 17px; padding: 14px; border: 1px solid #e1e4e7; background: #fff; }
.report-filter label, .task-filter label { display: grid; gap: .3rem; color: #747c83; font-size: .78rem; }
.report-filter input, .report-filter select, .task-filter select { min-height: 34px; }
.task-metrics { margin-bottom: 14px; }
.task-metrics .metric { min-height: 90px; }
.task-filter { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 13px; }
.task-filter select { min-width: 250px; height: 68px; }
.task-filter__actions { display: flex; align-items: center; gap: 12px; }
.live-sync { display: inline-flex; align-items: center; gap: 7px; color: var(--tb-muted); font-size: .76rem; white-space: nowrap; }
.live-sync i { width: 7px; height: 7px; border-radius: 50%; background: var(--tb-success); box-shadow: 0 0 0 4px rgba(91, 181, 116, .12); }
.task-status-cell { min-width: 150px; display: grid; justify-items: start; gap: 6px; }
.task-status-cell .badge i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.task-status-cell small { color: var(--tb-muted); font-size: .7rem; white-space: nowrap; }
.metric, .card { border-radius: 0; }
.metric { min-height: 118px; box-shadow: var(--shadow); }
.metric__label { color: #6e9acb; font-size: .95rem; }
.metric__value { color: #43494e; font-size: 1.85rem; font-weight: 400; }
.metric__hint { color: #46bd87; }
.dashboard-card { padding: 0; }
.dashboard-card .card__head { margin: 0; padding: 16px 18px; }
.dashboard-card .card__head h2 { color: #59616a; font-size: .98rem; font-weight: 500; }
.dashboard-card .table-wrap { border-width: 1px 0 0; }
.dashboard-card tbody td { height: 45px; }
.standalone-form { max-width: 980px; margin: 0 auto; padding: 24px; }
.field > span, .field > label, fieldset legend { color: #616970; font-size: .85rem; font-weight: 500; }
.field small { font-size: .75rem; line-height: 1.4; }
.notification-events { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 0; padding: 14px; border: 1px solid var(--tb-line); border-radius: 12px; }
.notification-events legend { padding: 0 6px; }
.notification-events .check { min-height: 36px; }
.inline-help { align-self: start; color: #5d91cf; font-size: .84rem; text-decoration: none; }
.permissions-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1rem; margin-top: .45rem; }
.radio-row { display: flex; flex-wrap: wrap; gap: .8rem 1.5rem; margin: 0; padding: .65rem .8rem; border: 1px solid #dfe2e5; }
.radio-row legend { padding: 0 .3rem; }
.weekday-field { display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin: 0; padding: .65rem .8rem; border: 1px solid #dfe2e5; }
.schedule-form textarea { min-height: 58px; }
.view-switch { display: flex; justify-content: flex-end; gap: .5rem; margin-bottom: .75rem; }
.chart-card { position: relative; padding: 28px; }
.chart-scale { display: flex; justify-content: space-between; margin-bottom: 22px; color: #8d949a; font-size: .72rem; }
.footer { min-height: 54px; display: flex; align-items: center; justify-content: space-between; padding: 0 55px; border-top: 1px solid #e1e4e7; background: #fff; color: #8d949a; font-size: .78rem; }
.footer button { border: 0; background: transparent; color: #6a737c; cursor: pointer; }
body:has(.cookie-notice)::before { content: ""; position: fixed; z-index: 79; inset: 0; background: rgba(35, 42, 48, .32); }
.cookie-notice { position: fixed; z-index: 80; left: 20px; bottom: 20px; width: min(400px, calc(100vw - 40px)); padding: 16px; border-radius: 9px; background: #fff; color: #4f555b; box-shadow: 0 7px 24px rgba(27, 36, 44, .23); }
.cookie-notice p { margin: 0 0 12px; font-family: Arial, sans-serif; font-size: .86rem; line-height: 1.45; }
.cookie-notice a { color: #5d91cf; }
.cookie-notice .btn { min-width: 92px; float: right; }
.parity-filter-table th:nth-child(-n+2)::after { content: "▼"; float: right; color: #a5aaaf; font-size: .62rem; }
.chat-bubble { position: fixed; z-index: 78; right: 16px; bottom: 18px; width: 66px; height: 66px; display: grid; place-items: center; border: 7px solid rgba(93, 145, 207, .2); border-radius: 50%; background: #4f91e8; color: transparent; font-size: 0; text-decoration: none; box-shadow: 0 5px 16px rgba(34, 92, 160, .28); }
.chat-bubble::before { content: "•••"; width: 30px; height: 21px; display: grid; place-items: center; border-radius: 10px; background: #fff; color: #4f91e8; font-size: .64rem; letter-spacing: 1px; }

/* Login parity: original Service Inspector authorization screen */
.login-page { min-height: 100vh; position: relative; display: grid; place-items: start center; padding: 92px 24px 86px; background: #f5f5f5; font-family: "Roboto Condensed", "Arial Narrow", "Segoe UI", Arial, sans-serif; }
.login-card { width: min(575px, 100%); }
.login-brand { display: flex; align-items: center; justify-content: center; margin-bottom: 31px; }
.login-brand img { width: 252px; height: 88px; display: block; object-fit: contain; }
.login-card h1 { margin: 0 0 42px; color: #5d91cf; font-size: 1.9rem; font-weight: 300; text-align: center; }
.login-card .field { gap: 4px; margin-bottom: 17px; }
.login-card .field > span:first-child { color: #787d82; font-size: .93rem; font-weight: 400; }
.login-card input { min-height: 37px; padding: .4rem .18rem; border: 0; border-bottom: 1px solid #d7dade; border-radius: 0; background: #fff; color: #50555a; box-shadow: none; }
.login-card input:focus { border-bottom-color: #5d91cf; outline: 0; }
.password-field { display: flex; align-items: stretch; }
.password-field input { min-width: 0; flex: 1; }
.password-field button { width: 39px; border: 0; border-bottom: 1px solid #d7dade; background: #fff; color: #7f878e; cursor: pointer; }
.login-local { margin: -24px 0 21px; padding: .55rem .7rem; text-align: center; }
.login-card .error { min-height: 18px; text-align: center; }
.login-submit { width: 270px; min-height: 36px; display: flex; align-items: center; justify-content: space-between; margin: 9px auto 19px; padding: .45rem .9rem; background: #5d91cf; font-weight: 400; }
.login-links { display: flex; align-items: center; justify-content: center; gap: 12px; }
.login-links a { color: #5d91cf; font-size: .9rem; text-decoration: none; }
.login-links a + a::before { content: ""; display: inline-block; height: 15px; margin-right: 12px; border-left: 1px solid #cdd1d5; vertical-align: middle; }
.login-footer { min-height: 54px; position: fixed; z-index: 4; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; gap: 4px; border-top: 1px solid #e1e4e7; background: #fff; color: #8d949a; font-size: .78rem; }
.login-footer strong { color: #69737c; font-weight: 400; }
.login-footer button { margin-left: 7px; border: 0; background: transparent; color: #68727b; cursor: pointer; }

@media (max-width: 1100px) {
  .main { padding: 42px 28px; }
  .report-filter { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
}

@media (max-width: 820px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar { width: min(86vw, 300px); }
  .topbar { padding: 0 14px; }
  .topbar__title { font-size: 1.35rem; }
  .main { padding: 22px 12px 70px; }
  .report-filter { grid-template-columns: 1fr 1fr; }
  .list-toolbar { align-items: stretch; flex-direction: column; }
  .list-toolbar__right { width: 100%; flex-wrap: wrap; margin-left: 0; }
  .list-toolbar .search { flex: 1; width: auto; min-width: 150px; }
  .permissions-grid { grid-template-columns: 1fr; }
  .footer { padding: 0 14px; }
}

@media (max-width: 560px) {
  .report-filter { grid-template-columns: 1fr; }
  .grid--metrics, .task-metrics { grid-template-columns: 1fr 1fr; }
  .chat-bubble { width: 54px; height: 54px; border-width: 5px; }
  .login-page { padding: 55px 18px 78px; }
  .login-brand { margin-bottom: 25px; }
  .login-brand img { width: 228px; height: 80px; }
  .login-card h1 { margin-bottom: 30px; font-size: 1.65rem; }
  .login-submit { width: min(270px, 100%); }
  .login-links { flex-direction: column; gap: 7px; }
  .login-links a + a::before { display: none; }
}

/* TB Agent: shared Termburg product language */
@font-face {
  font-family: "Ikra Slab";
  src: url("/fonts/ikra-slab.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --tb-gold: #BA9B4F;
  --tb-gold-dark: #A08640;
  --tb-gold-soft: #D4B366;
  --tb-gold-text: #8B6823;
  --tb-focus: #8B6823;
  --tb-control-line: #A08640;
  --tb-terracotta: #C4944E;
  --tb-cream: #FBF9F4;
  --tb-warm: #F5EFE0;
  --tb-paper: #FFFFFF;
  --tb-ink: #3D3530;
  --tb-muted: #665D55;
  --tb-brand-muted: #8A8078;
  --tb-dark: #1E1A2E;
  --tb-dark-warm: #2E2D4B;
  --tb-dark-line: #3C3558;
  --tb-line: #E8E0D2;
  --tb-success: #5DB879;
  --tb-info: #6AABDA;
  --tb-danger: #C65F5F;
  --brand: var(--tb-dark);
  --brand-2: var(--tb-dark-warm);
  --accent: var(--tb-gold);
  --ink: var(--tb-ink);
  --muted: var(--tb-muted);
  --line: var(--tb-line);
  --soft: var(--tb-warm);
  --paper: var(--tb-paper);
  --success: var(--tb-success);
  --danger: var(--tb-danger);
  --shadow: 0 12px 32px rgba(61, 53, 48, .07);
  font-family: Inter, system-ui, "Segoe UI", Arial, sans-serif;
}

html, body { background: var(--tb-cream); color: var(--tb-ink); }
body { line-height: 1.45; }
h1, h2, h3, .topbar__title, .login-hero__content h1, .login-card__heading h2 { font-family: "Ikra Slab", Georgia, "Times New Roman", serif; }
button, a, input, select, textarea { transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--tb-focus); outline-offset: 3px; }
input, select, textarea { min-height: 44px; padding: .66rem .8rem; border: 1px solid var(--tb-control-line); border-radius: 10px; background: var(--tb-paper); color: var(--tb-ink); }
input:hover, select:hover, textarea:hover { border-color: #cbc09f; }
input:focus, select:focus, textarea:focus { border-color: var(--tb-gold); box-shadow: 0 0 0 3px rgba(186, 155, 79, .12); }
input[type="checkbox"], input[type="radio"] { min-height: 1.15rem; accent-color: var(--tb-gold-dark); }
.field > span, .field > label, fieldset legend { color: var(--tb-ink); font-weight: 650; }
.muted, .field small { color: var(--tb-muted); }
.eyebrow { color: var(--tb-gold-text); font-size: .7rem; letter-spacing: .12em; }

.btn { min-height: 42px; padding: .62rem .95rem; border: 1px solid transparent; border-radius: 11px; background: var(--tb-gold); color: var(--tb-dark); font-size: .84rem; font-weight: 750; box-shadow: 0 5px 14px rgba(168, 138, 61, .14); }
.btn:hover { background: var(--tb-gold-dark); color: #fff; transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn--soft { border-color: var(--tb-control-line); background: var(--tb-paper); color: var(--tb-ink); box-shadow: none; }
.btn--soft:hover { border-color: var(--tb-gold-soft); background: var(--tb-warm); color: var(--tb-ink); }
.btn--accent { background: var(--tb-success); color: #fff; }
.btn--accent:hover { background: #4DA568; }
.btn--danger { background: #F8E9E4; color: var(--tb-danger); }

.shell { grid-template-columns: 252px minmax(0, 1fr); background: var(--tb-cream); }
.shell--single-view { grid-template-columns: minmax(0, 1fr); }
.shell--single-view .workspace { min-height: 100svh; }
.sidebar { padding-bottom: 18px; background: var(--tb-dark); color: #C9C3D8; scrollbar-color: var(--tb-dark-line) transparent; }
.brand--sidebar { min-height: 76px !important; gap: 12px !important; padding: 14px 18px !important; border-bottom: 1px solid var(--tb-dark-line) !important; background: var(--tb-dark) !important; text-transform: none !important; }
.brand__emblem { width: 42px; height: 42px; flex: 0 0 42px; object-fit: contain; }
.brand--sidebar .brand__emblem { width: 44px; height: 44px; flex-basis: 44px; image-rendering: auto; }
.brand__copy { display: grid; gap: 1px; color: #fff; line-height: 1.1; }
.brand__copy strong { color: var(--tb-gold); font-family: "Ikra Slab", Georgia, serif; font-size: 1.08rem; font-weight: 400; letter-spacing: .04em; }
.brand__copy small { color: #AFA7C4; font-size: .69rem; font-weight: 500; letter-spacing: .035em; }
.sidebar nav { padding: 14px 10px 0; }
.nav-group { margin: 2px 0; }
.nav-link { min-height: 42px; gap: 10px; margin: 2px 0; padding: .58rem .7rem; border-radius: 10px; color: #BDB6CF; font-size: .84rem; }
.nav-link:hover, .nav-link.active { padding-left: .7rem; border-left: 0; background: rgba(186, 155, 79, .12); color: #fff; }
.nav-link.active { background: rgba(186, 155, 79, .18); color: var(--tb-gold-soft); }
.nav-link__icon { width: 22px; color: #88809F; font-size: .94rem; }
.nav-link:hover .nav-link__icon, .nav-link.active .nav-link__icon { color: var(--tb-gold); }
.nav-group summary { padding-right: .7rem; }
.nav-group .nav-link--nested { min-height: 37px; margin-left: 30px; padding: .45rem .65rem; border-left: 1px solid var(--tb-dark-line); border-radius: 0 9px 9px 0; font-size: .78rem; }
.nav-group .nav-link--nested:hover, .nav-group .nav-link--nested.active { padding-left: .65rem; border-left-color: var(--tb-gold); background: rgba(186, 155, 79, .1); }
.workspace { background: var(--tb-cream); }
.topbar { min-height: 72px; padding: 0 clamp(18px, 3vw, 40px); border-bottom: 1px solid rgba(224, 217, 200, .8); background: rgba(255, 253, 247, .94); box-shadow: 0 3px 16px rgba(45, 43, 61, .04); backdrop-filter: blur(14px); }
.topbar__menu { display: none; width: 42px; height: 42px; border: 1px solid var(--tb-line); border-radius: 11px; background: var(--tb-paper); color: var(--tb-ink); }
.topbar__title { color: var(--tb-ink); font-size: 1.42rem; font-weight: 700; }
.avatar { width: 42px; height: 42px; border: 1px solid var(--tb-line); border-radius: 13px; background: var(--tb-paper); color: var(--tb-gold-text); font-size: 1rem; }
.user-menu__panel { top: 52px; width: 270px; gap: 5px; padding: 14px; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-paper); box-shadow: 0 18px 44px rgba(45, 43, 61, .14); }
.user-menu__panel button { min-height: 40px; padding: 0 12px; border-radius: 8px; background: var(--tb-cream); color: var(--tb-ink); }
.user-menu__panel button:hover { background: var(--tb-warm); }

.main { width: min(1480px, 100%); max-width: 1480px; padding: clamp(24px, 3vw, 42px); }
.demo-guide { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; padding: 16px 18px; border: 1px solid rgba(186, 155, 79, .52); border-radius: 16px; background: linear-gradient(105deg, #FFF9E9, #FFFDF7); box-shadow: var(--shadow); }
.demo-guide > div { min-width: 0; display: grid; gap: 3px; }
.demo-guide span { color: var(--tb-gold-text); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.demo-guide strong { color: var(--tb-ink); font-family: "Ikra Slab", Georgia, serif; font-size: 1.08rem; }
.demo-guide p { margin: 0; color: var(--tb-muted); font-size: .82rem; }
.demo-guide .btn { flex: 0 0 auto; }
.page-head, .page-head:has(.button-row:empty) { min-height: 74px; display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 22px; }
.page-head > div:first-child { display: block; }
.page-head h1 { margin: 0; color: var(--tb-ink); font-size: clamp(1.65rem, 3vw, 2.25rem); font-weight: 700; }
.page-head p { max-width: 720px; margin-top: 6px; color: var(--tb-muted); }
.list-toolbar { margin-bottom: 16px; }
.list-toolbar .search { min-height: 42px; border: 1px solid var(--tb-line); border-radius: 10px; background: var(--tb-paper); }
.period-filter { min-height: 42px; }

.metric, .card, .template-card { border: 1px solid rgba(224, 217, 200, .86); border-radius: 16px; background: var(--tb-paper); box-shadow: var(--shadow); }
.metric { min-height: 126px; padding: 18px; }
.metric::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: 3px; background: linear-gradient(90deg, var(--tb-gold), var(--tb-terracotta)); opacity: .78; }
.metric__label { color: var(--tb-muted); font-size: .86rem; font-weight: 600; }
.metric__value { color: var(--tb-ink); font-family: Georgia, serif; font-size: 2rem; font-weight: 700; }
.metric__hint { color: var(--tb-success); }
.card { padding: 18px; }
.card--flush { padding: 0; }
.dashboard-card .card__head { padding: 18px 20px; }
.dashboard-card .card__head h2 { color: var(--tb-ink); font-family: Georgia, serif; font-size: 1.05rem; font-weight: 700; }
.template-card { padding: 18px; }
.list-row, .question, .task-card { border-color: var(--tb-line); border-radius: 12px; }
.kanban__column { border: 1px solid var(--tb-line); border-radius: 16px; background: rgba(240, 235, 216, .65); }

.table-wrap { overflow: auto; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-paper); box-shadow: 0 7px 22px rgba(45, 43, 61, .045); }
table { color: var(--tb-ink); font-size: .86rem; }
th, td { padding: .72rem 1rem; border-color: #ECE7D9; }
th { height: 46px; background: #F8F4E8; color: var(--tb-muted); font-size: .77rem; font-weight: 700; letter-spacing: .035em; }
tbody td { height: 58px; }
tbody tr:hover td { background: #FFFCF4; }
tbody strong { color: var(--tb-ink); font-weight: 650; }
.row-actions { min-width: 76px; flex-direction: row; gap: 6px; }
.icon-action { width: 34px; min-width: 34px; height: 34px; min-height: 34px; border: 1px solid var(--tb-line); border-radius: 9px; background: var(--tb-dark); color: #fff; }
.icon-action:hover { border-color: var(--tb-gold); background: var(--tb-dark-warm); color: var(--tb-gold-soft); }
.icon-action--run { border-color: transparent; background: var(--tb-success); }
.badge { background: #E7F5EB; color: #367E4A; }
.badge--gray { background: #F0EEF4; color: var(--tb-muted); }
.badge--warn { background: #FBF0D7; color: #8B6823; }
.badge--danger { background: #F9E7E4; color: var(--tb-danger); }
.score { background: #E7F5EB; color: #367E4A; }

.report-filter, .radio-row, .weekday-field { border-color: var(--tb-line); border-radius: 14px; background: var(--tb-paper); box-shadow: 0 7px 22px rgba(45, 43, 61, .04); }
.report-filter { padding: 18px; }
.modal-backdrop { background: rgba(30, 26, 46, .58); backdrop-filter: blur(6px); }
.modal { padding: 22px; border: 1px solid var(--tb-line); border-radius: 20px; background: var(--tb-paper); box-shadow: 0 32px 90px rgba(30, 26, 46, .28); }
.template-editor__block { border-color: var(--tb-line); background: var(--tb-cream); }
.mobile-preview { border-color: var(--tb-dark); background: var(--tb-cream); box-shadow: 0 24px 70px rgba(30, 26, 46, .18); }
.mobile-preview__head { background: var(--tb-dark); }
.progress > span, .bar__fill { background: linear-gradient(90deg, var(--tb-gold-dark), var(--tb-terracotta)); }
.photo-control { border-color: var(--tb-control-line); color: var(--tb-gold-text); }

.footer { min-height: 62px; padding: 0 clamp(18px, 3vw, 40px); border-top: 1px solid var(--tb-line); background: rgba(255, 253, 247, .9); color: var(--tb-muted); }
.footer strong { color: var(--tb-ink); }
.cookie-notice { left: 24px; bottom: 24px; width: min(430px, calc(100vw - 48px)); padding: 18px; border: 1px solid var(--tb-line); border-radius: 16px; color: var(--tb-ink); box-shadow: 0 18px 48px rgba(30, 26, 46, .2); }
body:has(.cookie-notice)::before { background: rgba(30, 26, 46, .3); }
.toast { border: 1px solid var(--tb-dark-line); border-radius: 12px; background: var(--tb-dark); box-shadow: 0 16px 50px rgba(30, 26, 46, .22); }
.chat-bubble { display: none; }

/* Branded sign-in screen */
.login-page { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, .92fr) minmax(460px, 1.08fr); place-items: stretch; padding: 0; background: var(--tb-cream); font-family: Inter, system-ui, "Segoe UI", Arial, sans-serif; }
.login-hero { position: relative; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; gap: 48px; padding: clamp(32px, 5vw, 72px); overflow: hidden; background: var(--tb-dark); color: #fff; }
.login-hero::before { content: ""; position: absolute; width: min(54vw, 720px); aspect-ratio: 1; right: -34%; bottom: -34%; border: 1px solid rgba(217, 203, 161, .25); border-radius: 50%; box-shadow: 0 0 0 70px rgba(186, 155, 79, .035), 0 0 0 140px rgba(186, 155, 79, .025); }
.login-hero::after { content: ""; position: absolute; width: 220px; height: 220px; top: -80px; right: -70px; border-radius: 50%; background: radial-gradient(circle, rgba(212, 149, 106, .22), transparent 68%); }
.tb-lockup { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; }
.tb-mark { width: 50px; height: 50px; flex: 0 0 50px; object-fit: contain; }
.tb-lockup > span:last-child { display: grid; gap: 1px; }
.tb-lockup strong { color: var(--tb-gold); font-family: "Ikra Slab", Georgia, serif; font-size: 1.24rem; font-weight: 400; letter-spacing: .055em; }
.tb-lockup small { color: #B9B1CB; font-size: .74rem; letter-spacing: .045em; }
.login-hero__content { position: relative; z-index: 1; max-width: 660px; }
.login-kicker { display: inline-flex; margin-bottom: 18px; color: var(--tb-gold-soft); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.login-hero__content h1 { max-width: 610px; margin: 0 0 20px; color: #FFFDF6; font-size: clamp(2.4rem, 5.2vw, 5.2rem); font-weight: 700; line-height: .98; letter-spacing: -.045em; }
.login-hero__content p { max-width: 560px; margin: 0; color: #C9C2D8; font-size: clamp(.95rem, 1.35vw, 1.12rem); line-height: 1.65; }
.login-hero__chips { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 9px; }
.login-hero__chips span { padding: .58rem .78rem; border: 1px solid rgba(217, 203, 161, .25); border-radius: 999px; background: rgba(217, 203, 161, .06); color: #D5CEE2; font-size: .76rem; }
.login-panel { position: relative; min-height: 100vh; display: grid; place-items: center; padding: clamp(28px, 6vw, 84px); background: radial-gradient(circle at 75% 15%, rgba(217, 203, 161, .22), transparent 28%), var(--tb-cream); }
.login-card { width: min(100%, 450px); padding: clamp(26px, 4vw, 38px); border: 1px solid rgba(224, 217, 200, .9); border-radius: 24px; background: rgba(255, 255, 255, .95); box-shadow: 0 24px 64px rgba(45, 43, 61, .1); }
.login-brand-logo { width: 156px; height: auto; display: block; margin: 0 auto 24px; }
.login-card__heading { margin-bottom: 26px; }
.login-card__heading > span { color: var(--tb-gold-text); font-size: .7rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.login-card__heading h2 { margin: 8px 0 6px; color: var(--tb-ink); font-size: clamp(1.65rem, 3vw, 2rem); }
.login-card__heading p { margin: 0; color: var(--tb-muted); font-size: .88rem; }
.demo-access { display: grid; gap: 10px; margin: 0 0 18px; }
.demo-access__head { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.demo-access__head > div { display: grid; gap: 2px; }
.demo-access__head span { color: var(--tb-gold-text); font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.demo-access__head strong { color: var(--tb-ink); font-size: .92rem; }
.demo-access__head small { color: var(--tb-muted); font-size: .7rem; }
.demo-access__list { display: grid; gap: 7px; }
.demo-account { width: 100%; min-height: 58px; display: grid; grid-template-columns: 36px minmax(0, 1fr) 20px; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-paper); color: var(--tb-ink); cursor: pointer; text-align: left; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.demo-account:hover { border-color: var(--tb-gold); background: #FCF8EC; transform: translateY(-1px); }
.demo-account:disabled { cursor: wait; opacity: .65; transform: none; }
.demo-account__icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; font-weight: 800; }
.demo-account--manager .demo-account__icon { background: #EEE9F7; color: #584A76; }
.demo-account--inspector .demo-account__icon { background: #E8F2FA; color: #356E98; }
.demo-account--executor .demo-account__icon { background: #E7F5EB; color: #367E4A; }
.demo-account--chat .demo-account__icon { background: #F3E8C8; color: #8D681C; }
.demo-account > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.demo-account strong { font-size: .82rem; }
.demo-account small { overflow: hidden; color: var(--tb-muted); font-size: .68rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.demo-account__arrow { color: var(--tb-gold-text); font-size: 1rem; text-align: center; }
.login-divider { display: flex; align-items: center; gap: 10px; margin: 1px 0 16px; color: var(--tb-muted); font-size: .68rem; }
.login-divider::before, .login-divider::after { content: ""; height: 1px; flex: 1; background: var(--tb-line); }
.login-divider span { white-space: nowrap; }
.login-card .field { gap: 7px; margin-bottom: 16px; }
.login-card .field > span:first-child { color: var(--tb-ink); font-size: .82rem; font-weight: 650; }
.login-card input { min-height: 48px; padding: .7rem .85rem; border: 1px solid var(--tb-control-line); border-radius: 11px; background: #fff; color: var(--tb-ink); }
.login-card input:focus { border-color: var(--tb-gold); box-shadow: 0 0 0 3px rgba(186, 155, 79, .12); }
.password-field button { width: 48px; margin-left: -48px; z-index: 1; border: 0; border-radius: 0 11px 11px 0; background: transparent; color: var(--tb-muted); }
.login-local { margin: 0 0 18px; border-color: var(--tb-line); background: var(--tb-cream); color: var(--tb-muted); text-align: left; }
.login-card .error { min-height: 21px; margin-top: -2px; text-align: left; }
.login-submit { width: 100%; min-height: 48px; margin: 5px 0 16px; padding: .65rem 1rem; border-radius: 12px; background: var(--tb-gold); color: var(--tb-dark); font-weight: 750; }
.login-submit:hover { background: var(--tb-gold-dark); color: #fff; }
.login-help { margin: 0; color: var(--tb-muted); font-size: .78rem; text-align: center; }
.login-install { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-paper); color: var(--tb-ink); font-weight: 700; cursor: pointer; }
.login-install:hover { border-color: var(--tb-gold); background: var(--tb-warm); }
.login-install .ui-icon, .pwa-install--menu .ui-icon { width: 19px; height: 19px; }
.pwa-install--menu { display: flex; align-items: center; gap: 8px; }
.pwa-install[hidden] { display: none !important; }
.login-footer { min-height: auto; position: absolute; right: 28px; bottom: 20px; left: auto; border: 0; background: transparent; color: var(--tb-muted); }
.login-footer strong { color: var(--tb-ink); font-weight: 650; }

.install-guide-backdrop { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: max(18px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom)); background: rgba(30, 26, 46, .58); backdrop-filter: blur(8px); }
.install-guide { width: min(100%, 520px); max-height: calc(100svh - 36px); overflow: auto; padding: 24px; border: 1px solid var(--tb-line); border-radius: 24px; background: var(--tb-paper); color: var(--tb-ink); box-shadow: 0 28px 80px rgba(30, 26, 46, .3); }
.install-guide > header { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.install-guide > header > div { display: grid; gap: 4px; }
.install-guide > header span { color: var(--tb-gold-text); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.install-guide h2 { margin: 0; font-size: 1.55rem; }
.install-guide .icon-action { width: 44px; height: 44px; flex: 0 0 44px; }
.install-guide__app { display: flex; align-items: center; gap: 14px; margin: 20px 0; padding: 14px; border-radius: 16px; background: var(--tb-cream); }
.install-guide__app img { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 15px; box-shadow: 0 8px 20px rgba(30, 26, 46, .16); }
.install-guide__app > div { min-width: 0; display: grid; gap: 3px; }
.install-guide__app strong { font-size: 1rem; }
.install-guide__app span { color: var(--tb-muted); font-size: .78rem; }
.install-guide__steps { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.install-guide__steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; padding: 12px; border: 1px solid var(--tb-line); border-radius: 14px; }
.install-guide__steps li > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--tb-gold); color: var(--tb-dark); font-weight: 800; }
.install-guide__steps li > div { min-width: 0; display: grid; gap: 3px; }
.install-guide__steps strong { font-size: .88rem; }
.install-guide__steps p, .install-guide__note { margin: 0; color: var(--tb-muted); font-size: .78rem; line-height: 1.45; }
.install-guide__note { margin-top: 14px; }
.install-guide__apple { min-height: 44px; display: flex; align-items: center; justify-content: center; margin-top: 14px; border-radius: 11px; background: var(--tb-dark); color: #fff; font-size: .82rem; font-weight: 700; text-decoration: none; }

@media (max-width: 1100px) {
  .shell { grid-template-columns: 232px minmax(0, 1fr); }
  .main { padding: 30px 24px; }
  .report-filter { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .login-hero { padding: 42px; }
  .login-hero__content h1 { font-size: clamp(2.5rem, 5.5vw, 4rem); }
}

@media (max-width: 820px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar { width: min(88vw, 310px); box-shadow: 18px 0 52px rgba(30, 26, 46, .28); }
  .topbar { min-height: 64px; padding: 0 14px; }
  .topbar__menu { display: inline-grid; place-items: center; }
  .topbar__title { font-size: 1.2rem; }
  .main { padding: 22px 14px 64px; }
  .demo-guide { align-items: stretch; flex-direction: column; gap: 12px; }
  .demo-guide .btn { width: 100%; }
  .page-head, .page-head:has(.button-row:empty) { min-height: 0; align-items: stretch; flex-direction: column; margin-bottom: 18px; }
  .page-head h1 { font-size: 1.75rem; }
  .report-filter { grid-template-columns: 1fr 1fr; }
  .login-page { grid-template-columns: 1fr; }
  .login-hero { min-height: auto; gap: 24px; padding: 30px; }
  .login-hero__content h1 { max-width: 590px; font-size: clamp(2rem, 8vw, 3.2rem); }
  .login-hero__content p { max-width: 640px; }
  .login-panel { min-height: 560px; padding: 34px 20px 76px; }
  .login-footer { right: 0; bottom: 20px; left: 0; justify-content: center; }
}

@media (max-width: 560px) {
  .grid--metrics, .task-metrics { grid-template-columns: 1fr; }
  .metric { min-height: 108px; }
  .list-toolbar__right { align-items: stretch; flex-direction: column; }
  .list-toolbar .search, .list-toolbar__right .btn { width: 100%; }
  .report-filter { grid-template-columns: 1fr; }
  .footer { padding: 0 14px; }
  .cookie-notice { right: 14px; bottom: 14px; left: 14px; width: auto; }
  .login-hero { padding: 24px 20px; }
  .tb-mark { width: 44px; height: 44px; border-radius: 13px; }
  .login-hero__content h1 { font-size: 2.1rem; }
  .login-hero__content p { font-size: .9rem; }
  .login-hero__chips { gap: 6px; }
  .login-hero__chips span { padding: .45rem .62rem; }
  .login-panel { min-height: 520px; padding: 24px 14px 70px; }
  .login-card { padding: 24px 18px; border-radius: 18px; }
  .demo-account { min-height: 60px; }
  .task-filter { align-items: stretch; flex-direction: column; }
  .task-filter label, .task-filter select, .task-filter__actions { width: 100%; }
  .task-filter__actions { align-items: stretch; flex-direction: column; }
  .live-sync { min-height: 32px; }
}

/* Role-focused workflow */
.account-chip { display: inline-flex; align-items: center; min-height: 30px; padding: 0 10px; border: 1px solid var(--tb-line); border-radius: 999px; background: var(--tb-paper); color: var(--tb-muted); font-size: .72rem; font-weight: 700; }
.account-badge--manager { background: #EEE9F7; color: #584A76; }
.account-badge--inspector { background: #E8F2FA; color: #356E98; }
.account-badge--executor { background: #E7F5EB; color: #367E4A; }
.issue-preset-badge--cleaning { background: #E7F5EB; color: #367E4A; }
.issue-preset-badge--technician { background: #E8F2FA; color: #356E98; }
.issue-preset-badge--lifeguard { background: #E5F6F5; color: #23736F; }
.account-type-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; border: 0; }
.account-type-picker legend { grid-column: 1 / -1; margin-bottom: 5px; font-weight: 700; }
.account-type-option { position: relative; min-height: 112px; display: flex; cursor: pointer; }
.account-type-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.account-type-option > span { width: 100%; display: grid; align-content: start; gap: 7px; padding: 15px; border: 1px solid var(--tb-line); border-radius: 13px; background: var(--tb-paper); }
.account-type-option small { color: var(--tb-muted); font-size: .75rem; line-height: 1.4; }
.account-type-option input:checked + span { border-color: var(--tb-gold); background: #FCF7E8; box-shadow: 0 0 0 3px rgba(186, 155, 79, .12); }
.account-type-option input:focus-visible + span { outline: 2px solid var(--tb-gold-soft); outline-offset: 3px; }
.executor-specialty-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 14px; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-cream); }
.executor-specialty-picker[hidden] { display: none; }
.executor-specialty-picker legend { padding: 0 7px; font-weight: 700; }
.executor-specialty-option { position: relative; min-height: 82px; display: flex; cursor: pointer; }
.executor-specialty-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.executor-specialty-option > span { width: 100%; display: grid; align-content: center; gap: 5px; padding: 13px 14px; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-paper); }
.executor-specialty-option small { color: var(--tb-muted); font-size: .74rem; line-height: 1.35; }
.executor-specialty-option input:checked + span { border-color: var(--tb-gold); background: #FCF7E8; box-shadow: 0 0 0 3px rgba(186, 155, 79, .12); }
.executor-specialty-option input:focus-visible + span { outline: 2px solid var(--tb-gold-soft); outline-offset: 3px; }
.routing-always-on { display: inline-flex; align-items: center; min-height: 34px; padding: 0 10px; border-radius: 9px; background: #E7F5EB; color: #367E4A; font-size: .76rem; font-weight: 750; }
.item-place-pair { flex: 1 1 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.item-workplace-field, .item-location-field { min-width: 0; margin: 0; }
.item-assignee-field { min-width: min(260px, 100%); flex: 1; margin: 0; }

.role-summary { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; padding: 14px; border: 1px solid var(--tb-line); border-radius: 15px; background: var(--tb-paper); box-shadow: var(--shadow); }
.role-setup-notice { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; padding: 20px 22px; border: 1px solid rgba(186, 155, 79, .55); border-radius: 16px; background: #FFF9E9; box-shadow: var(--shadow); }
.role-setup-notice span { color: var(--tb-gold-text); font-size: .7rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.role-setup-notice h2 { margin: 5px 0 3px; font-size: 1.2rem; }
.role-setup-notice p { margin: 0; color: var(--tb-muted); font-size: .84rem; }
.role-summary > div { min-width: 108px; display: flex; align-items: baseline; gap: 7px; padding: 10px 14px; border-radius: 11px; background: var(--tb-cream); }
.role-summary strong { font-family: Georgia, serif; font-size: 1.55rem; }
.role-summary span { color: var(--tb-muted); font-size: .78rem; }
.role-summary small { margin-left: auto; color: var(--tb-muted); }
.role-summary__danger strong { color: var(--tb-danger); }
.executor-task-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.executor-task { overflow: hidden; border: 1px solid var(--tb-line); border-radius: 17px; background: var(--tb-paper); box-shadow: var(--shadow); }
.executor-task--overdue { border-color: rgba(198, 95, 95, .45); }
.executor-task__summary { min-height: 48px; display: grid; gap: 14px; padding: 18px; list-style: none; cursor: pointer; transition: background-color .16s ease; }
.executor-task__summary::-webkit-details-marker { display: none; }
.executor-task__summary:hover { background: #FFFEFA; }
.executor-task__summary:focus-visible { outline: 3px solid var(--tb-gold); outline-offset: -3px; }
.executor-task[aria-busy="true"] .executor-task__summary { cursor: progress; }
.executor-task__head { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.executor-task__head > span:first-child { display: block; }
.executor-task__time { margin-top: 6px; color: var(--tb-muted); font-size: .72rem; }
.executor-task__deadline { color: var(--tb-muted); font-size: .68rem; line-height: 1.35; text-align: right; }
.executor-task__deadline strong { color: var(--tb-ink); font-size: .76rem; font-weight: 700; }
.executor-task__location { display: flex; align-items: start; gap: 11px; padding: 13px; border: 1px solid rgba(186, 155, 79, .42); border-radius: 13px; background: var(--tb-warm); }
.executor-task__pin { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 50%; background: var(--tb-gold); color: var(--tb-dark); font-size: 1.15rem; }
.executor-task__location-copy { min-width: 0; display: grid; flex: 1; gap: 2px; }
.executor-task__location small, .executor-task__work > span, .executor-task__issue small { color: var(--tb-muted); font-size: .68rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.executor-task__location strong { overflow-wrap: anywhere; font-size: .95rem; }
.executor-task__location span { color: var(--tb-muted); font-size: .75rem; }
.executor-task__location em { margin-top: 4px; color: var(--tb-gold-text); font-size: .82rem; font-style: normal; font-weight: 750; }
.executor-task__chevron { width: 32px; height: 32px; display: grid; flex: 0 0 32px; place-items: center; align-self: center; border-radius: 50%; color: var(--tb-gold-text) !important; transition: transform .16s ease; }
.executor-task__chevron .ui-icon { width: 18px; height: 18px; }
.executor-task[open] .executor-task__chevron { transform: rotate(180deg); }
.executor-task__details { display: grid; gap: 14px; padding: 16px 18px 18px; border-top: 1px solid var(--tb-line); }
.executor-task__work { display: grid; gap: 5px; }
.executor-task h2 { margin: 0; color: var(--tb-ink); font-size: 1.16rem; line-height: 1.25; }
.executor-task__issue { display: grid; gap: 9px; padding: 13px; border-radius: 12px; background: var(--tb-cream); }
.executor-task__issue > div { display: grid; gap: 4px; }
.executor-task__issue strong { color: var(--tb-danger); font-size: .88rem; }
.executor-task__issue p { margin: 0; color: var(--tb-ink); font-size: .86rem; line-height: 1.48; overflow-wrap: anywhere; }
.executor-task__evidence { margin: 0; }
.executor-task__photo-button { position: relative; width: 100%; min-height: 160px; overflow: hidden; padding: 0; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-dark); color: #fff; cursor: zoom-in; }
.executor-task__photo-button:focus-visible { outline: 3px solid var(--tb-gold); outline-offset: 3px; }
.executor-task__photo-button > span { position: absolute; right: 9px; bottom: 9px; display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 7px 10px; border-radius: 9px; background: rgba(30, 26, 46, .86); font: inherit; font-size: .72rem; font-weight: 750; }
.executor-task__photo-button .ui-icon { width: 17px; height: 17px; }
.executor-task__photo { width: 100%; height: 100%; max-height: 300px; display: block; border-radius: 11px; object-fit: cover; transition: transform .18s ease; }
.executor-task__photo-button:hover .executor-task__photo { transform: scale(1.02); }
.executor-task__evidence figcaption { margin-top: 5px; color: var(--tb-muted); font-size: .68rem; }
.photo-lightbox { margin: 0; display: grid; gap: 10px; }
.photo-lightbox img { width: 100%; max-height: calc(92vh - 130px); display: block; border-radius: 14px; background: var(--tb-dark); object-fit: contain; }
.photo-lightbox figcaption { color: var(--tb-muted); font-size: .78rem; text-align: center; }
.executor-task__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.executor-task__meta div { padding: 9px 10px; border-radius: 9px; background: var(--tb-cream); }
.executor-task__meta dt { color: var(--tb-muted); font-size: .7rem; }
.executor-task__meta dd { margin: 3px 0 0; font-size: .82rem; font-weight: 650; }
.technician-deadline { display: grid; grid-template-columns: 42px minmax(140px, 1fr) auto; align-items: end; gap: 10px; padding: 13px; border: 1px solid rgba(186, 155, 79, .48); border-radius: 13px; background: #FFF9E9; }
.technician-deadline__icon { width: 42px; height: 42px; display: grid; place-items: center; align-self: center; border-radius: 12px; background: var(--tb-gold); color: var(--tb-dark); }
.technician-deadline__icon .ui-icon { width: 21px; height: 21px; }
.technician-deadline .field { min-width: 0; margin: 0; }
.technician-deadline input { width: 100%; min-height: 48px; }
.technician-deadline .btn { min-height: 48px; white-space: nowrap; }
.technician-deadline > small { grid-column: 2 / -1; color: var(--tb-muted); font-size: .7rem; line-height: 1.35; }
.completed-tasks { grid-column: 1 / -1; margin-top: 8px; }
.completed-tasks > summary { min-height: 44px; padding: 11px 14px; border: 1px solid var(--tb-line); border-radius: 11px; background: var(--tb-paper); cursor: pointer; font-weight: 700; }
.completed-tasks > .executor-task-list { margin-top: 12px; }

.inspector-hero { min-height: 126px; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 18px; padding: 22px 26px; overflow: hidden; border-radius: 18px; background: var(--tb-dark); color: #fff; box-shadow: 0 16px 36px rgba(30, 26, 46, .16); }
.inspector-hero > div { display: grid; }
.inspector-hero span { color: #BEB6CF; font-size: .78rem; }
.inspector-hero strong { color: var(--tb-gold-soft); font-family: Georgia, serif; font-size: 3rem; line-height: 1; }
.inspector-hero p { max-width: 420px; margin: 0; color: #DDD7E7; }
.inspection-job-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 14px; }
.inspection-job { display: grid; gap: 13px; padding: 18px; border: 1px solid var(--tb-line); border-radius: 16px; background: var(--tb-paper); box-shadow: var(--shadow); }
.inspection-job--ready { border-color: rgba(186, 155, 79, .58); }
.inspection-job__status { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--tb-muted); font-size: .74rem; }
.inspection-job h1, .inspection-job h2 { margin: 0; font-size: 1.15rem; }
.inspection-job p { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0; color: var(--tb-muted); font-size: .84rem; }
.inspection-job p strong { color: var(--tb-ink); font-weight: 650; }
.inspection-job p span { white-space: nowrap; }
.section-title { grid-column: 1 / -1; margin: 12px 0 0; font-size: 1.12rem; }

.shell--inspector-home .main { max-width: 720px; }
.shell--inspector-home .footer { display: none; }
.inspector-workspace { display: grid; gap: 14px; }
.shift-attendance { display: grid; gap: 12px; padding: 18px; border: 1px solid var(--tb-line); border-radius: 16px; background: var(--tb-paper); box-shadow: var(--shadow); }
.shift-attendance > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.shift-attendance > header > div { min-width: 0; display: grid; gap: 3px; }
.shift-attendance > header > div > span { color: var(--tb-muted); font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.shift-attendance h2 { margin: 0; font-size: 1.15rem; }
.shift-attendance__count { flex: 0 0 auto; padding: 7px 10px; border-radius: 999px; background: #E7F5EB; color: #367E4A; font-size: .7rem; font-weight: 750; }
.shift-attendance__count--pending { background: var(--tb-cream); color: #8B6823; }
.shift-attendance__list { display: grid; gap: 8px; }
.shift-attendance__row { min-width: 0; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid var(--tb-line); border-radius: 13px; background: var(--tb-cream); }
.shift-attendance__avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--tb-dark); color: var(--tb-gold-soft); font-size: .75rem; font-weight: 750; }
.shift-attendance__row > div { min-width: 0; display: grid; gap: 3px; }
.shift-attendance__row strong { overflow: hidden; color: var(--tb-ink); font-size: .84rem; text-overflow: ellipsis; white-space: nowrap; }
.shift-attendance__row > div > span { color: var(--tb-muted); font-size: .7rem; }
.shift-attendance__confirm { min-height: 44px; padding: 8px 13px; font-size: .76rem; }
.shift-attendance__confirmed { display: inline-flex; align-items: center; gap: 5px; color: #367E4A; font-size: .72rem; font-weight: 750; white-space: nowrap; }
.shift-attendance__confirmed > span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: #E7F5EB; }
.shift-attendance__empty { margin: 0; padding: 14px; border-radius: 11px; background: var(--tb-cream); color: var(--tb-muted); font-size: .8rem; text-align: center; }
.shift-attendance > small { color: var(--tb-muted); font-size: .68rem; }
.inspection-job--primary { gap: 16px; padding: 22px; border-width: 1px; border-top: 4px solid var(--tb-gold); box-shadow: 0 14px 34px rgba(45, 43, 61, .08); }
.inspection-job--primary h1 { font-size: clamp(1.35rem, 4vw, 1.75rem); line-height: 1.18; }
.inspection-job--primary .btn { min-height: 52px; font-size: .92rem; }
.inspection-job--draft { border-color: rgba(186, 155, 79, .72); background: linear-gradient(145deg, #FFFCF4, var(--tb-paper)); }
.inspection-draft__progress { height: 7px; overflow: hidden; border-radius: 999px; background: #E7E1D5; }
.inspection-draft__progress > span { height: 100%; display: block; border-radius: inherit; background: var(--tb-gold); }
.inspection-draft__restart { min-height: 44px; border: 0; background: transparent; color: var(--tb-muted); cursor: pointer; font: inherit; font-size: .78rem; text-decoration: underline; text-underline-offset: 3px; }
.inspection-draft__restart:hover { color: var(--tb-ink); }
.inspector-empty { padding: 28px 22px; border: 1px solid var(--tb-line); border-radius: 16px; background: var(--tb-paper); text-align: center; box-shadow: var(--shadow); }
.inspector-empty h1 { margin: 0; font-size: 1.35rem; }
.inspector-empty p { max-width: 430px; margin: 8px auto 0; color: var(--tb-muted); }
.inspector-secondary-stack { display: grid; gap: 9px; }
.inspector-secondary { overflow: hidden; border: 1px solid var(--tb-line); border-radius: 13px; background: var(--tb-paper); }
.inspector-secondary > summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; list-style: none; cursor: pointer; color: var(--tb-ink); font-size: .86rem; font-weight: 700; }
.inspector-secondary > summary::-webkit-details-marker { display: none; }
.inspector-secondary > summary::after { margin-left: 2px; color: var(--tb-muted); content: "⌄"; font-size: 1rem; transition: transform .16s ease; }
.inspector-secondary[open] > summary::after { transform: rotate(180deg); }
.inspector-secondary > summary strong { min-width: 26px; height: 26px; display: grid; place-items: center; margin-left: auto; padding: 0 6px; border-radius: 999px; background: var(--tb-cream); color: var(--tb-ink); font-size: .72rem; }
.inspector-secondary[open] > summary { border-bottom: 1px solid var(--tb-line); }
.inspector-secondary__body { padding: 12px; }
.inspector-assigned > summary { color: var(--tb-gold-text); }
.inspector-assigned > summary strong { background: var(--tb-gold); color: var(--tb-dark); }
.inspector-assigned-list { display: grid; gap: 8px; }
.inspector-assigned-task { width: 100%; min-height: 92px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 12px; padding: 12px; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-cream); color: var(--tb-ink); font: inherit; text-align: left; cursor: pointer; }
.inspector-assigned-task:hover { border-color: var(--tb-gold); background: var(--tb-warm); }
.inspector-assigned-task:focus-visible { outline: 3px solid var(--tb-gold); outline-offset: 2px; }
.inspector-assigned-task > span { grid-column: 2; grid-row: 1 / span 2; justify-self: end; }
.inspector-assigned-task > strong { grid-column: 1; grid-row: 1; overflow-wrap: anywhere; font-size: .9rem; }
.inspector-assigned-task > small { grid-column: 1; color: var(--tb-muted); font-size: .74rem; line-height: 1.4; }
.inspector-assigned-task > em { grid-column: 1 / -1; color: var(--tb-gold-text); font-size: .75rem; font-style: normal; font-weight: 750; }
.inspector-assigned__done { display: block; margin-top: 10px; color: var(--tb-muted); text-align: right; }
.upcoming-check-list { display: grid; gap: 1px; }
.upcoming-check { display: grid; grid-template-columns: 130px minmax(0, 1fr); align-items: center; gap: 12px; padding: 11px 4px; border-bottom: 1px solid var(--tb-line); }
.upcoming-check:last-of-type { border-bottom: 0; }
.upcoming-check time { color: var(--tb-muted); font-size: .72rem; }
.upcoming-check div { min-width: 0; display: grid; gap: 3px; }
.upcoming-check strong { overflow-wrap: anywhere; font-size: .82rem; }
.upcoming-check span, .secondary-note { color: var(--tb-muted); font-size: .72rem; }
.secondary-note { margin: 9px 4px 2px; }
.inspector-history-panel { display: grid; gap: 12px; }

.inspector-history-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.inspector-history-summary > div { min-width: 0; display: grid; gap: 2px; padding: 15px 16px; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-paper); box-shadow: 0 5px 18px rgba(45, 43, 61, .04); }
.inspector-history-summary strong { color: var(--tb-ink); font-family: Georgia, serif; font-size: 1.7rem; line-height: 1; }
.inspector-history-summary span { color: var(--tb-muted); font-size: .75rem; }
.history-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.history-filter__button { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--tb-control-line); border-radius: 999px; background: var(--tb-paper); color: var(--tb-muted); cursor: pointer; font: inherit; font-size: .8rem; }
.history-filter__button strong { min-width: 22px; height: 22px; display: grid; place-items: center; padding: 0 5px; border-radius: 999px; background: var(--tb-cream); color: var(--tb-ink); font-size: .72rem; }
.history-filter__button.active { border-color: var(--tb-gold); background: var(--tb-warm); color: var(--tb-ink); }
.history-filter__button.active strong { background: var(--tb-dark); color: #fff; }
.history-filter__button:focus-visible { outline: 3px solid rgba(186, 155, 79, .32); outline-offset: 2px; }
.inspector-history-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px; }
.inspector-history-list > .empty { grid-column: 1 / -1; }
.inspector-history-card { min-width: 0; display: grid; gap: 13px; padding: 17px; border: 1px solid var(--tb-line); border-left: 4px solid var(--tb-success); border-radius: 15px; background: var(--tb-paper); box-shadow: var(--shadow); }
.inspector-history-card--missed { border-left-color: var(--tb-danger); }
.inspector-history-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.inspector-history-card__head time { color: var(--tb-muted); font-size: .7rem; text-align: right; }
.history-status { display: inline-flex; align-items: center; gap: 6px; color: #367E4A; font-size: .7rem; font-weight: 750; }
.history-status::before { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--tb-success); content: ""; }
.history-status--missed { color: #9C4242; }
.history-status--missed::before { background: var(--tb-danger); }
.inspector-history-card__body { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 14px; }
.inspector-history-card h2 { margin: 0; overflow-wrap: anywhere; font-size: 1.03rem; line-height: 1.22; }
.inspector-history-card__body p { margin: 5px 0 0; color: var(--tb-ink); font-size: .82rem; }
.inspector-history-card__body small { display: block; margin-top: 4px; color: var(--tb-muted); font-size: .72rem; }
.inspector-history-card__score { min-width: 72px; display: grid; gap: 2px; padding: 9px 10px; border-radius: 10px; background: var(--tb-cream); text-align: right; }
.inspector-history-card__score span { color: var(--tb-muted); font-size: .65rem; }
.inspector-history-card__score strong { color: var(--tb-ink); font-size: 1.1rem; }
.inspector-history-card__note { max-width: 180px; color: var(--tb-danger) !important; text-align: right; }

.fast-inspection { width: min(760px, 100%); margin: 0 auto; overflow: hidden; border: 1px solid var(--tb-line); border-radius: 22px; background: var(--tb-paper); box-shadow: 0 22px 58px rgba(45, 43, 61, .11); }
.fast-inspection__head { display: grid; grid-template-columns: 1fr auto auto; gap: 14px; padding: 22px 24px 18px; background: var(--tb-dark); color: #fff; }
.fast-inspection__head > div:first-child > span { color: #BEB6CF; font-size: .74rem; }
.fast-inspection__head h2 { margin: 5px 0 0; color: #fff; font-size: 1.2rem; }
.fast-inspection__counter { display: flex; align-items: baseline; gap: 5px; color: #BEB6CF; }
.fast-inspection__counter strong { color: var(--tb-gold-soft); font-family: Georgia, serif; font-size: 1.8rem; }
.inspection-home { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 0 10px; border: 1px solid var(--tb-dark-line); border-radius: 11px; background: transparent; color: #fff; cursor: pointer; font: inherit; font-size: .72rem; font-weight: 700; }
.inspection-home:hover { border-color: var(--tb-gold-soft); color: var(--tb-gold-soft); }
.fast-inspection__head .progress { grid-column: 1 / -1; background: var(--tb-dark-line); }
.inspection-setup { border-bottom: 1px solid var(--tb-line); background: var(--tb-cream); }
.inspection-setup summary { min-height: 44px; padding: 12px 24px; cursor: pointer; color: var(--tb-muted); font-size: .8rem; font-weight: 700; }
.inspection-setup > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0 24px 18px; }
.fast-inspection__body { padding: 24px; }
.inspection-route { display: grid; gap: 10px; margin-bottom: 18px; padding: 13px 14px; border: 1px solid var(--tb-line); border-radius: 14px; background: var(--tb-cream); }
.inspection-route__top { min-width: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.inspection-route__top span { color: var(--tb-gold-text); font-size: .66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.inspection-route__top strong { min-width: 0; overflow: hidden; color: var(--tb-muted); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.inspection-route__place { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; }
.inspection-route__pin { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--tb-gold); color: var(--tb-dark); }
.inspection-route__pin .ui-icon { width: 18px; height: 18px; }
.inspection-route__place > div { min-width: 0; display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 10px; }
.inspection-route__place span { color: var(--tb-muted); font-size: .65rem; font-weight: 700; text-transform: uppercase; }
.inspection-route__place strong { grid-column: 1 / -1; overflow-wrap: anywhere; color: var(--tb-ink); font-size: 1rem; }
.inspection-route__place small { grid-row: 1; grid-column: 2; color: var(--tb-muted); font-size: .68rem; }
.inspection-route__next { display: flex; align-items: baseline; gap: 8px; padding-top: 9px; border-top: 1px solid var(--tb-line); }
.inspection-route__next span { color: var(--tb-muted); font-size: .66rem; font-weight: 700; text-transform: uppercase; }
.inspection-route__next strong { min-width: 0; overflow: hidden; color: var(--tb-ink); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.fast-question h1 { margin: 12px 0 24px; font-size: clamp(1.55rem, 4vw, 2.2rem); line-height: 1.18; }
.fast-answer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.fast-answer { min-height: 92px; display: flex; align-items: center; justify-content: center; gap: 11px; padding: 14px; border: 1px solid var(--tb-control-line); border-radius: 15px; background: var(--tb-paper); color: var(--tb-ink); cursor: pointer; }
.fast-answer > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; font-size: 1.15rem; }
.fast-answer > strong { font-size: .92rem; }
.fast-answer--yes > span { background: #E7F5EB; color: #367E4A; }
.fast-answer--yes.active { border-color: var(--tb-success); background: #F1FAF3; }
.fast-answer--issue > span { background: #F9E7E4; color: var(--tb-danger); }
.fast-answer--issue.active { border-color: var(--tb-danger); background: #FFF7F5; }
.fast-answer--skip { grid-column: 1 / -1; min-height: 54px; }
.fast-answer--skip > span { background: #F0EEF4; color: var(--tb-muted); }
.fast-answer--skip.active { border-color: var(--tb-gold); background: var(--tb-warm); }
@media (hover: hover) and (pointer: fine) {
  .fast-answer--yes:hover { border-color: var(--tb-success); background: #F1FAF3; }
  .fast-answer--issue:hover { border-color: var(--tb-danger); background: #FFF7F5; }
}
.issue-editor, .pass-evidence { display: grid; gap: 14px; margin-top: 16px; padding: 16px; border: 1px solid #E8C8C1; border-radius: 15px; background: #FFF9F7; }
.pass-evidence { border-color: var(--tb-line); background: var(--tb-cream); }
.pass-evidence p { margin: 0; color: var(--tb-muted); }
.issue-route { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 12px; padding: 12px; border-radius: 11px; background: var(--tb-paper); }
.issue-route > span, .issue-route > small { color: var(--tb-muted); font-size: .72rem; }
.issue-route > strong { grid-row: 1 / 3; grid-column: 2; color: var(--tb-ink); }
.issue-auto-fields { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 10px; }
.issue-auto-field { min-width: 0; }
.issue-auto-field > span { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.issue-auto-field > span small { color: var(--tb-success); font-size: .65rem; font-weight: 700; white-space: nowrap; }
.issue-auto-field select { min-width: 0; width: 100%; min-height: 48px; padding-right: 38px; background-color: var(--tb-paper); font-weight: 650; text-overflow: ellipsis; }
.issue-preset-picker > span { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.issue-preset-picker > span small { color: var(--tb-muted); font-size: .68rem; font-weight: 700; white-space: nowrap; }
.issue-preset-picker select { width: 100%; min-height: 48px; padding-right: 38px; background-color: var(--tb-paper); font-weight: 650; }
.issue-preset-empty { display: grid; gap: 4px; padding: 12px 13px; border: 1px dashed var(--tb-control-line); border-radius: 11px; background: var(--tb-paper); }
.issue-preset-empty strong { color: var(--tb-ink); font-size: .82rem; }
.issue-preset-empty span { color: var(--tb-muted); font-size: .75rem; line-height: 1.4; }
.issue-options { display: flex; flex-wrap: wrap; gap: 7px; }
.issue-options__label { display: block; margin-bottom: 7px; color: var(--tb-muted); font-size: .72rem; font-weight: 700; }
.issue-option { min-height: 42px; padding: 7px 11px; border: 1px solid var(--tb-control-line); border-radius: 999px; background: var(--tb-paper); color: var(--tb-ink); cursor: pointer; font-size: .78rem; }
.issue-option.active { border-color: var(--tb-danger); background: #F9E7E4; color: #913E3E; }
.issue-editor .field { margin: 0; }
.issue-editor textarea { min-height: 76px; }
.fast-photo { margin-top: 0; border-color: var(--tb-gold-soft); background: var(--tb-paper); }
.issue-send { background: var(--tb-dark); color: #fff; }
.issue-send:hover { background: var(--tb-dark-warm); color: var(--tb-gold-soft); }
.issue-sent { display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid #CBE5D2; border-radius: 14px; background: #F0FAF3; }
.issue-sent > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--tb-success); color: #fff; font-size: 1.1rem; }
.issue-sent p { margin: 2px 0 0; color: var(--tb-muted); font-size: .8rem; }
.fast-inspection__nav { display: flex; justify-content: space-between; gap: 10px; margin-top: 18px; }
.inspection-route-hint { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border: 1px solid var(--tb-line); border-radius: 13px; background: var(--tb-cream); }
.inspection-route-hint > span { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 38px; border-radius: 50%; background: var(--tb-gold); color: var(--tb-dark); }
.inspection-route-hint > div { display: grid; gap: 3px; }
.inspection-route-hint strong { color: var(--tb-ink); font-size: .84rem; }
.inspection-route-hint small { color: var(--tb-muted); font-size: .74rem; line-height: 1.4; }

@media (max-width: 820px) {
  .account-chip { display: none; }
  .account-type-picker { grid-template-columns: 1fr; }
  .executor-specialty-picker { grid-template-columns: 1fr; }
  .item-place-pair { grid-template-columns: 1fr; }
  .account-type-option { min-height: 86px; }
  .executor-task-list, .inspection-job-list, .inspector-history-list { grid-template-columns: 1fr; }
  .role-summary { align-items: stretch; flex-wrap: wrap; }
  .role-summary > div { flex: 1; }
  .role-summary small { width: 100%; margin: 0; }
  .fast-inspection { border-radius: 17px; }
  .inspection-setup > div { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .role-setup-notice { align-items: stretch; flex-direction: column; }
  .workplace-rooms { padding: 12px; }
  .workplace-rooms > header { align-items: stretch; flex-direction: column; }
  .workplace-rooms > header .btn { width: 100%; min-height: 44px; }
  .workplace-order button { width: 44px; height: 44px; }
  .inspector-hero { min-height: 108px; padding: 18px; }
  .inspector-hero strong { font-size: 2.5rem; }
  .inspector-hero p { max-width: 190px; font-size: .82rem; }
  .inspection-job { padding: 15px; }
  .shell--inspector-home .main { padding: 12px 10px max(18px, env(safe-area-inset-bottom)); }
  .shift-attendance { gap: 10px; padding: 15px; border-radius: 15px; }
  .shift-attendance > header { align-items: flex-start; }
  .shift-attendance__row { grid-template-columns: 38px minmax(0, 1fr); padding: 10px; }
  .shift-attendance__avatar { width: 38px; height: 38px; }
  .shift-attendance__confirm, .shift-attendance__confirmed { grid-column: 1 / -1; width: 100%; justify-content: center; }
  .inspection-job--primary { gap: 14px; padding: 17px 15px; border-radius: 15px; }
  .inspection-job--primary h1 { font-size: 1.28rem; }
  .inspection-job p { align-items: flex-start; flex-direction: column; gap: 4px; }
  .inspector-empty { padding: 24px 16px; }
  .inspector-secondary__body { padding: 10px; }
  .upcoming-check { grid-template-columns: 1fr; gap: 5px; padding: 10px 3px; }
  .inspector-history-summary { gap: 6px; }
  .inspector-history-summary > div { padding: 12px 8px; text-align: center; }
  .inspector-history-summary strong { font-size: 1.45rem; }
  .inspector-history-summary span { overflow-wrap: anywhere; font-size: .66rem; }
  .history-filter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .history-filter__button { width: 100%; justify-content: space-between; border-radius: 11px; }
  .inspector-history-card { padding: 14px; }
  .inspector-history-card__head { align-items: flex-start; flex-direction: column; gap: 5px; }
  .inspector-history-card__head time { text-align: left; }
  .inspector-history-card__body { align-items: start; grid-template-columns: 1fr; }
  .inspector-history-card__score { width: 100%; display: flex; align-items: baseline; justify-content: space-between; text-align: left; }
  .inspector-history-card__note { max-width: none; text-align: left; }
  .executor-task__meta { grid-template-columns: 1fr; }
  .shell--inspection { min-height: 100svh; overflow-x: clip; }
  .shell--inspection .workspace { min-height: 100svh; }
  .shell--inspection .topbar { min-height: 56px; height: 56px; padding: 0 max(8px, env(safe-area-inset-right)) 0 max(8px, env(safe-area-inset-left)); }
  .shell--inspection .topbar__left { min-width: 0; gap: 8px; }
  .shell--inspection .topbar__menu,
  .shell--inspection .avatar { width: 44px; height: 44px; flex: 0 0 44px; }
  .shell--inspection .topbar__title { min-width: 0; overflow: hidden; font-size: clamp(1rem, 5vw, 1.15rem); line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
  .shell--inspection .user-menu { flex: 0 0 auto; }
  .shell--inspection .user-menu summary { min-width: 44px; }
  .shell--inspection .user-menu__arrow { display: none; }
  .shell--inspection .main { padding: 8px max(8px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
  .shell--inspection .demo-guide,
  .shell--inspection .footer { display: none; }
  .fast-inspection { width: 100%; min-width: 0; border-radius: 14px; box-shadow: 0 10px 30px rgba(45, 43, 61, .08); }
  .fast-inspection__head { grid-template-columns: minmax(0, 1fr) auto 44px; align-items: start; gap: 8px; padding: 12px; }
  .fast-inspection__identity { min-width: 0; }
  .fast-inspection__head > div:first-child > span { display: block; overflow: hidden; font-size: .66rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
  .fast-inspection__head h2 { max-width: 100%; margin-top: 3px; overflow-wrap: anywhere; font-size: clamp(.88rem, 4.2vw, 1rem); line-height: 1.15; }
  .fast-inspection__head h2.fast-inspection__title--compact { font-size: clamp(.8rem, 3.8vw, .92rem); }
  .fast-inspection__counter { align-items: baseline; align-self: start; gap: 4px; padding-top: 1px; white-space: nowrap; }
  .fast-inspection__counter strong { font-size: 1.45rem; line-height: 1; }
  .fast-inspection__counter span { font-size: .72rem; }
  .inspection-home { width: 54px; height: 44px; min-height: 44px; flex-direction: column; gap: 1px; padding: 3px; border-radius: 12px; font-size: .56rem; line-height: 1; }
  .fast-inspection__head .progress { height: 6px; margin-top: 2px; }
  .inspection-setup summary { min-height: 44px; padding: 10px 12px; }
  .inspection-setup > div { padding: 0 12px 12px; }
  .fast-inspection__body { min-width: 0; padding: 14px 12px 12px; }
  .inspection-route { gap: 8px; margin-bottom: 12px; padding: 10px 11px; border-radius: 12px; }
  .inspection-route__top { gap: 8px; }
  .inspection-route__top span { font-size: .61rem; }
  .inspection-route__top strong { max-width: 46%; font-size: .66rem; }
  .inspection-route__place { grid-template-columns: 30px minmax(0, 1fr); gap: 8px; }
  .inspection-route__pin { width: 30px; height: 30px; }
  .inspection-route__place strong { font-size: .9rem; }
  .inspection-route__place small { font-size: .62rem; }
  .fast-question h1 { margin: 7px 0 14px; overflow-wrap: anywhere; font-size: clamp(1.18rem, 5.8vw, 1.42rem); line-height: 1.08; }
  .fast-question--compact h1 { font-size: clamp(1.06rem, 5.2vw, 1.28rem); }
  .fast-question--dense h1 { font-size: clamp(.96rem, 4.8vw, 1.16rem); line-height: 1.14; }
  .question__count { font-size: .67rem; letter-spacing: .015em; }
  .fast-answer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .fast-answer { min-width: 0; min-height: 64px; gap: 7px; padding: 8px 6px; border-radius: 13px; }
  .fast-answer { touch-action: manipulation; user-select: none; }
  .fast-answer:active { transform: scale(.985); transition-duration: 0s; }
  .fast-answer > span { width: 30px; height: 30px; flex: 0 0 30px; font-size: 1rem; }
  .fast-answer > strong { min-width: 0; overflow-wrap: anywhere; font-size: clamp(.76rem, 3.5vw, .88rem); line-height: 1.15; }
  .fast-answer--skip { grid-column: 1 / -1; min-height: 50px; }
  .issue-editor, .pass-evidence { gap: 10px; margin-top: 12px; padding: 12px; }
  .issue-auto-fields { grid-template-columns: 1fr; gap: 10px; }
  .fast-inspection__nav { gap: 8px; margin-top: 12px; }
  .fast-inspection__nav .btn { min-height: 44px; }
  .issue-route { grid-template-columns: 1fr; }
  .issue-route > strong { grid-row: auto; grid-column: auto; }
  .fast-inspection__nav .btn { flex: 1; }
}

/* Practical application shell: one icon language, clearer hierarchy and role-based mobile navigation */
.ui-icon { width: 20px; height: 20px; display: block; flex: 0 0 20px; pointer-events: none; }
.shell h1, .shell h2, .shell h3, .topbar__title { font-family: Inter, system-ui, "Segoe UI", Arial, sans-serif; }
.shell h1, .shell h2, .shell h3 { letter-spacing: -.025em; }
.sidebar-role { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 12px 12px 4px; padding: 9px 10px; border: 1px solid var(--tb-dark-line); border-radius: 10px; background: rgba(255,255,255,.025); }
.sidebar-role span { color: #8F88A2; font-size: .63rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sidebar-role strong { overflow: hidden; color: #E7E2EF; font-size: .72rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.sidebar nav { padding-top: 6px; }
.nav-link { min-height: 46px; align-items: center; }
.nav-link > span:nth-child(2) { min-width: 0; line-height: 1.25; }
.nav-link__icon { width: 22px; display: grid; place-items: center; }
.nav-link__icon .ui-icon { width: 19px; height: 19px; }
.nav-group .nav-link--nested { min-height: 42px; margin-left: 27px; padding-block: .5rem; }
.nav-group .nav-link--nested .nav-link__icon { width: 18px; }
.nav-group .nav-link--nested .ui-icon { width: 16px; height: 16px; }
.nav-chevron { width: 20px; height: 20px; display: grid; place-items: center; margin-left: auto; transform: none; }
.nav-chevron .ui-icon { width: 16px; height: 16px; }
.nav-group[open] .nav-chevron { transform: rotate(180deg); }

.topbar { min-height: 64px; }
.topbar__title { font-size: 1.2rem; font-weight: 750; letter-spacing: -.02em; }
.topbar__menu { place-items: center; }
.topbar__menu .ui-icon { width: 21px; height: 21px; }
.topbar__actions { min-width: 0; display: flex; align-items: center; gap: 9px; }
.topbar__chat { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid var(--tb-line); border-radius: 11px; background: var(--tb-paper); color: var(--tb-ink); font-size: .76rem; font-weight: 750; text-decoration: none; }
.topbar__chat:hover { border-color: var(--tb-gold); background: var(--tb-warm); }
.topbar__chat .ui-icon { width: 19px; height: 19px; color: var(--tb-gold-text); }
.user-menu__panel a { min-height: 40px; display: flex; align-items: center; padding: 0 12px; border-radius: 8px; background: var(--tb-cream); color: var(--tb-ink); font-size: .76rem; text-decoration: none; }
.user-menu__panel a:hover { background: var(--tb-warm); }
.task-chat-link { text-decoration: none; }
.task-discuss { display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
.task-discuss .ui-icon { width: 19px; height: 19px; }
.inspector-task-focus { max-width: 760px; display: grid; gap: 13px; margin: 0 auto; padding: 20px; border: 1px solid var(--tb-line); border-radius: 17px; background: var(--tb-paper); box-shadow: var(--shadow); }
.inspector-task-focus > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.inspector-task-focus > header > div { min-width: 0; }
.inspector-task-focus > header span, .inspector-task-focus section small { color: var(--tb-gold-text); font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.inspector-task-focus h1 { margin: 5px 0 0; font-size: 1.42rem; }
.inspector-task-focus section { display: grid; gap: 4px; padding: 13px 14px; border: 1px solid var(--tb-line); border-radius: 12px; background: var(--tb-cream); }
.inspector-task-focus section strong { font-size: .88rem; }
.inspector-task-focus section p { margin: 0; color: var(--tb-muted); font-size: .8rem; line-height: 1.45; }
.main { width: 100%; max-width: 1380px; margin-inline: auto; }
.page-head, .page-head:has(.button-row:empty) { min-height: 0; align-items: center; }
.page-head h1 { font-size: clamp(1.6rem, 2.4vw, 2rem); line-height: 1.08; }
.page-head p { margin-top: 4px; }
.dashboard-card .card__head h2 { display: flex; align-items: center; gap: 9px; }
.dashboard-card .card__head .ui-icon { color: var(--tb-gold-text); }

.row-actions { min-width: 190px; display: flex; align-items: center; justify-content: flex-start; gap: 7px; white-space: nowrap; }
.icon-action { width: auto; min-width: 40px; height: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 10px; border-color: var(--tb-control-line); border-radius: 10px; background: var(--tb-paper); color: var(--tb-ink); box-shadow: 0 2px 7px rgba(45, 43, 61, .04); }
.icon-action .ui-icon { width: 17px; height: 17px; }
.icon-action .action-label { font-size: .74rem; font-weight: 700; }
.icon-action:hover { border-color: var(--tb-gold); background: var(--tb-warm); color: var(--tb-ink); }
.icon-action--only { width: 40px; padding: 0; }
.icon-action--danger { border-color: #EACBC5; background: #FFF8F6; color: #A44848; }
.icon-action--danger:hover { border-color: var(--tb-danger); background: #F9E7E4; color: #8B3535; }
.modal__head .icon-action { flex: 0 0 40px; }

.demo-account__icon .ui-icon { width: 20px; height: 20px; }
.demo-account__arrow { display: grid; place-items: center; }
.demo-account__arrow .ui-icon { width: 17px; height: 17px; }
.login-submit { display: flex; align-items: center; justify-content: space-between; }
.login-submit .ui-icon, .password-field .ui-icon { width: 19px; height: 19px; }
.executor-task__pin .ui-icon { width: 19px; height: 19px; }
.inspection-home .ui-icon { width: 18px; height: 18px; }
.fast-answer > span .ui-icon { width: 18px; height: 18px; }
.issue-sent > span .ui-icon { width: 19px; height: 19px; }
.photo-control { display: flex; align-items: center; justify-content: center; gap: 8px; }
.photo-control > span { display: grid; gap: 2px; }
.photo-control small { color: var(--tb-muted); font-size: .68rem; font-weight: 600; }
.photo-control .ui-icon { width: 20px; height: 20px; }
.mobile-tabbar, .sidebar-scrim { display: none; }

@media (max-width: 620px) {
  .modal:has(.photo-lightbox) { width: 100%; max-height: 100svh; padding: 14px; border-radius: 16px; }
  .photo-lightbox img { max-height: calc(100svh - 120px); }
  .executor-task__photo-button { min-height: 190px; }
}

@media (max-width: 820px) {
  .workspace { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .shell--single-view .workspace { padding-bottom: env(safe-area-inset-bottom); }
  .main { padding: 18px 14px 28px; }
  .footer { display: none; }
  .topbar { min-height: calc(58px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 14px 0; }
  .topbar__menu { display: none; }
  .topbar__title { font-size: 1.05rem; }
  .mobile-tabbar { position: fixed; z-index: 45; right: 0; bottom: 0; left: 0; min-height: 68px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: stretch; padding: 5px max(6px, env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)); border-top: 1px solid var(--tb-line); background: rgba(255, 253, 247, .98); box-shadow: 0 -8px 28px rgba(45, 43, 61, .08); backdrop-filter: blur(16px); }
  .mobile-tabbar__item { min-width: 0; min-height: 56px; display: grid; place-items: center; align-content: center; gap: 3px; padding: 4px 3px; border: 0; border-radius: 10px; background: transparent; color: #6F697B; cursor: pointer; }
  .mobile-tabbar__item .ui-icon { width: 21px; height: 21px; }
  .mobile-tabbar__item span { max-width: 100%; overflow: hidden; font-size: clamp(.61rem, 2.6vw, .7rem); font-weight: 650; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-tabbar__item.active { background: var(--tb-warm); color: var(--tb-gold-text); }
  .sidebar-scrim { position: fixed; z-index: 49; inset: 0; border: 0; background: rgba(30, 26, 46, .42); opacity: 0; pointer-events: none; transition: opacity .18s ease; }
  .shell--menu-open .sidebar-scrim { display: block; opacity: 1; pointer-events: auto; }
  .sidebar { z-index: 50; padding-top: env(safe-area-inset-top); }
  .sidebar-role { margin-top: 10px; }
  .page-head, .page-head:has(.button-row:empty) { gap: 14px; margin-bottom: 16px; }
  .page-head h1 { font-size: 1.55rem; }
  .page-head .button-row { width: 100%; }
  .page-head .button-row > * { flex: 1; }
  .demo-guide { min-height: 0; margin-bottom: 16px; padding: 14px; border-radius: 14px; box-shadow: none; }
  .row-actions { min-width: 176px; }
  .icon-action { min-height: 42px; height: 42px; }
  .executor-task__meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shell--inspection .workspace { padding-bottom: 0; }
  .shell--inspection .topbar__menu { display: inline-grid; }
}

@media (max-width: 430px) {
  .main { padding-inline: 10px; }
  .topbar { padding-inline: 10px; }
  .topbar__actions { gap: 6px; }
  .topbar__chat { width: 44px; padding: 0; }
  .topbar__chat span { display: none; }
  .inspector-task-focus { padding: 14px; border-radius: 14px; }
  .inspector-task-focus > header { flex-direction: column; }
  .avatar { width: 40px; height: 40px; border-radius: 11px; }
  .demo-guide strong { font-size: .98rem; }
  .demo-guide p { font-size: .78rem; }
  .executor-task { border-radius: 14px; }
  .executor-task__summary { gap: 11px; padding: 13px; }
  .executor-task__details { gap: 11px; padding: 13px; }
  .executor-task__location, .executor-task__issue { padding: 11px; }
  .executor-task__meta { gap: 6px; }
  .executor-task__meta div { padding: 8px; }
  .executor-task__meta dd { font-size: .76rem; overflow-wrap: anywhere; }
  .technician-deadline { grid-template-columns: 38px minmax(0, 1fr); gap: 8px; padding: 11px; }
  .technician-deadline__icon { width: 38px; height: 38px; }
  .technician-deadline .btn { grid-column: 1 / -1; width: 100%; }
  .technician-deadline > small { grid-column: 2; }
  .role-summary { gap: 8px; padding: 10px; }
  .role-summary > div { min-width: 0; padding: 8px 10px; }
  .role-summary small { font-size: .7rem; }
  .install-guide-backdrop { align-items: end; padding: 0; }
  .install-guide { width: 100%; max-height: calc(100svh - env(safe-area-inset-top)); padding: 20px 16px max(20px, env(safe-area-inset-bottom)); border-right: 0; border-bottom: 0; border-left: 0; border-radius: 24px 24px 0 0; }
  .install-guide h2 { font-size: 1.35rem; }
}

/* Compact manager workspace: five destinations with contextual tools inside each section. */
.manager-section-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 20px;
  padding: 5px;
  border: 1px solid var(--tb-line);
  border-radius: 14px;
  background: var(--tb-paper);
  box-shadow: 0 7px 22px rgba(45, 43, 61, .04);
}
.manager-section-tabs__item {
  min-height: 42px;
  flex: 1 1 auto;
  padding: 8px 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--tb-muted);
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
  font-weight: 700;
  white-space: nowrap;
}
.manager-section-tabs__item:hover { background: var(--tb-cream); color: var(--tb-ink); }
.manager-section-tabs__item.active { background: var(--tb-warm); color: var(--tb-gold-text); box-shadow: inset 0 0 0 1px rgba(186, 155, 79, .18); }

.manager-history-switch {
  width: fit-content;
  display: flex;
  gap: 4px;
  margin: -5px 0 16px;
  padding: 4px;
  border-radius: 11px;
  background: var(--tb-cream);
}
.manager-history-switch button {
  min-height: 40px;
  padding: 7px 16px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--tb-muted);
  cursor: pointer;
  font: inherit;
  font-size: .8rem;
  font-weight: 700;
}
.manager-history-switch button.active { background: var(--tb-paper); color: var(--tb-ink); box-shadow: 0 3px 10px rgba(45, 43, 61, .08); }

@media (max-width: 820px) {
  .manager-section-tabs {
    max-width: 100%;
    overflow-x: auto;
    justify-content: flex-start;
    margin-bottom: 16px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }
  .manager-section-tabs::-webkit-scrollbar { display: none; }
  .manager-section-tabs__item { min-height: 44px; flex: 0 0 auto; scroll-snap-align: start; }
  .manager-history-switch { width: 100%; }
  .manager-history-switch button { min-height: 44px; flex: 1; }
}

/* Task status filter: explicit touch-friendly chips instead of the native multiple select. */
.task-filter {
  align-items: flex-end;
  padding: 14px;
  border: 1px solid var(--tb-line);
  border-radius: 14px;
  background: var(--tb-paper);
  box-shadow: 0 7px 22px rgba(45, 43, 61, .04);
}
.task-status-filter { min-width: 0; display: grid; gap: 8px; }
.task-status-filter__label { color: var(--tb-muted); font-size: .72rem; font-weight: 750; letter-spacing: .025em; }
.task-status-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.task-status-chip {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border: 1px solid var(--tb-control-line);
  border-radius: 12px;
  background: var(--tb-cream);
  color: var(--tb-muted);
  cursor: pointer;
  font: inherit;
  font-size: .79rem;
  font-weight: 700;
  transition: border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
}
.task-status-chip:hover { border-color: #C9B97F; background: var(--tb-warm); color: var(--tb-ink); }
.task-status-chip.active { border-color: rgba(186, 155, 79, .6); background: var(--tb-paper); color: var(--tb-ink); box-shadow: 0 3px 11px rgba(45, 43, 61, .08); }
.task-status-chip__dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #AAA4B2; box-shadow: 0 0 0 4px rgba(170, 164, 178, .12); }
.task-status-chip--waiting.active .task-status-chip__dot { background: var(--tb-danger); box-shadow: 0 0 0 4px rgba(185, 87, 78, .12); }
.task-status-chip--progress.active .task-status-chip__dot { background: #D09A2D; box-shadow: 0 0 0 4px rgba(208, 154, 45, .14); }
.task-status-chip--done.active .task-status-chip__dot { background: var(--tb-success); box-shadow: 0 0 0 4px rgba(88, 174, 112, .13); }
.task-status-chip strong { min-width: 23px; height: 23px; display: grid; place-items: center; margin-left: 2px; padding: 0 6px; border-radius: 999px; background: rgba(45, 43, 61, .07); color: inherit; font-size: .7rem; }

@media (max-width: 820px) {
  .task-filter { padding: 12px; }
  .task-status-filter, .task-status-chips { width: 100%; }
  .task-status-chip { flex: 1 1 120px; justify-content: center; }
}

@media (max-width: 430px) {
  .task-status-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .task-status-chip { width: 100%; min-width: 0; padding-inline: 8px; }
  .task-status-chip:last-child { grid-column: 1 / -1; }
}