:root {
    --navy: #102434;
    --navy-2: #17384b;
    --green: #24a06b;
    --green-dark: #14744b;
    --green-soft: #e6f5ee;
    --blue-soft: #eaf2f8;
    --amber-soft: #fff4dd;
    --red: #c64b4b;
    --line: #d8e0e5;
    --line-dark: #bcc9d1;
    --ink: #1a2b36;
    --muted: #667984;
    --surface: #ffffff;
    --background: #edf2f4;
    --shadow: 0 24px 70px rgba(16, 36, 52, .16);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color: var(--ink);
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--background); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }

.brand-lockup { display: flex; align-items: center; gap: 13px; color: var(--navy); }
.brand-lockup > span:last-child { display: flex; flex-direction: column; line-height: 1.05; }
.brand-lockup strong { font-size: 20px; letter-spacing: -.02em; }
.brand-lockup small { margin-top: 5px; color: var(--muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.brand-mark { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 11px; background: var(--green); color: white; font-weight: 800; font-size: 19px; letter-spacing: -.08em; }
.brand-lockup.compact .brand-mark { width: 38px; height: 38px; border-radius: 9px; font-size: 16px; }
.brand-lockup.compact strong { font-size: 17px; }
.brand-logo-header { display: block; width: 108px; height: auto; object-fit: contain; }
.topbar .brand-lockup.compact > span:last-child { padding-left: 14px; border-left: 1px solid rgba(255,255,255,.2); }

.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(520px, .9fr) minmax(560px, 1.1fr); background: #f6f8f9; }
.login-card { padding: clamp(38px, 6vw, 84px); display: flex; flex-direction: column; justify-content: center; max-width: 760px; width: 100%; margin: auto; }
.login-copy { margin: clamp(48px, 7vh, 82px) 0 32px; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--green-dark); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 24px; height: 2px; background: var(--green); }
.login-copy h1 { margin: 13px 0 15px; color: var(--navy); font-size: clamp(40px, 5vw, 67px); line-height: .99; letter-spacing: -.055em; }
.login-copy p { margin: 0; max-width: 570px; color: var(--muted); font-size: 17px; line-height: 1.6; }
.primary-demo-button { width: 100%; min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 17px; padding: 15px 18px; border-radius: 14px; background: var(--green); color: white; text-decoration: none; box-shadow: 0 13px 30px rgba(36,160,107,.22); transition: .18s ease; }
.primary-demo-button:hover, .primary-demo-button:focus-visible { background: var(--green-dark); transform: translateY(-1px); outline: none; }
.primary-demo-button > span { display: flex; flex-direction: column; gap: 4px; }
.primary-demo-button strong { font-size: 16px; }
.primary-demo-button small { color: rgba(255,255,255,.72); font-size: 11px; }
.primary-demo-button b { font-size: 27px; }
.role-divider { position: relative; margin: 0 0 14px; color: #8a989f; font-size: 10px; text-align: center; text-transform: uppercase; letter-spacing: .07em; }
.role-divider::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--line); }
.role-divider span { position: relative; padding: 0 10px; background: #f6f8f9; }
.role-login-grid { display: grid; gap: 11px; }
.role-login-card button { width: 100%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: white; color: var(--ink); text-align: left; transition: .18s ease; }
.role-login-card button:hover, .role-login-card button:focus-visible { border-color: var(--green); box-shadow: 0 10px 30px rgba(16, 36, 52, .09); transform: translateY(-1px); outline: none; }
.avatar { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: white; font-size: 13px; font-weight: 800; }
.avatar.small { width: 35px; height: 35px; font-size: 11px; }
.role-login-text { display: flex; flex-direction: column; gap: 3px; }
.role-login-text strong { font-size: 15px; }
.role-login-text > span { color: var(--green-dark); font-size: 12px; font-weight: 750; }
.role-login-text small { color: var(--muted); font-size: 12px; }
.role-arrow { display: flex; align-items: center; gap: 5px; color: var(--green); font-size: 22px; padding: 0 5px; }
.role-arrow small { color: var(--green-dark); font-size: 9px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.demo-note { color: #82919a; font-size: 11px; margin: 18px 0 0; text-align: center; }

.login-visual { position: relative; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 27px; padding: 7vw 5vw; overflow: hidden; background: linear-gradient(145deg, var(--navy) 0%, #15384a 55%, #16513e 130%); }
.login-visual::before, .login-visual::after { content: ""; position: absolute; border-radius: 50%; filter: blur(2px); }
.login-visual::before { width: 440px; height: 440px; right: -160px; top: -150px; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 150px rgba(255,255,255,.018); }
.login-visual::after { width: 360px; height: 360px; left: -200px; bottom: -170px; background: rgba(36,160,107,.16); }
.visual-window { position: relative; z-index: 1; width: min(760px, 100%); border: 1px solid rgba(255,255,255,.22); border-radius: 15px; overflow: hidden; background: white; box-shadow: 0 38px 90px rgba(0,0,0,.35); transform: perspective(1400px) rotateY(-3deg) rotateX(1deg); }
.visual-top { height: 48px; display: flex; align-items: center; gap: 7px; padding: 0 18px; background: #f4f6f7; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.visual-top i { width: 9px; height: 9px; border-radius: 50%; background: #cad4d9; }
.visual-top i:nth-child(1) { background: #f07768; }
.visual-top i:nth-child(2) { background: #eab847; }
.visual-top i:nth-child(3) { background: #47b779; }
.visual-top span { margin-left: 8px; }
.visual-formula { display: grid; grid-template-columns: 75px 1fr; min-height: 40px; border-bottom: 1px solid var(--line); font-size: 12px; }
.visual-formula b, .visual-formula span { display: flex; align-items: center; padding: 0 13px; }
.visual-formula b { border-right: 1px solid var(--line); color: var(--muted); }
.visual-grid { display: grid; grid-template-columns: 40px 1.2fr 1.3fr .8fr .8fr; font-size: clamp(9px, .75vw, 12px); }
.visual-grid > * { min-width: 0; padding: 13px 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.visual-grid > b { background: #f1f4f5; color: #71818a; text-align: center; font-weight: 650; }
.visual-grid > span { color: #334853; }
.visual-grid .pill { margin: 8px; padding: 5px 8px; border-radius: 99px; text-align: center; font-weight: 700; }
.pill.green { background: var(--green-soft); color: var(--green-dark); }
.pill.blue { background: var(--blue-soft); color: #376c91; }
.pill.amber { background: var(--amber-soft); color: #9a6a13; }
.visual-caption { z-index: 1; max-width: 600px; color: white; text-align: center; display: flex; flex-direction: column; gap: 8px; }
.visual-caption strong { font-size: 20px; }
.visual-caption span { color: rgba(255,255,255,.68); font-size: 14px; line-height: 1.5; }

#appMeta { display: none; }
.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
.topbar { height: 64px; padding: 0 22px; display: flex; align-items: center; justify-content: space-between; background: var(--navy); color: white; box-shadow: 0 3px 12px rgba(16,36,52,.18); }
.topbar .brand-lockup, .topbar .brand-lockup small { color: white; }
.topbar .brand-lockup small { opacity: .55; }
.top-actions { display: flex; align-items: center; gap: 14px; }
.database-badge { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border: 1px solid rgba(255,255,255,.25); border-radius: 99px; color: rgba(255,255,255,.82); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.database-badge i { width: 7px; height: 7px; border-radius: 50%; background: #49d996; box-shadow: 0 0 0 3px rgba(73,217,150,.15); }
.icon-button { width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.2); border-radius: 8px; background: transparent; color: white; font-weight: 800; }
.user-menu { display: flex; align-items: center; gap: 9px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.15); }
.role-switcher { display: flex; flex-direction: column; gap: 2px; color: rgba(255,255,255,.6); font-size: 8px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.role-switcher select { width: 235px; border: 0; border-bottom: 1px solid rgba(255,255,255,.24); border-radius: 0; padding: 1px 22px 3px 0; outline: 0; background: transparent; color: white; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.role-switcher select:focus { border-bottom-color: #49d996; }
.role-switcher option { background: white; color: var(--navy); }

.ribbon { min-height: 68px; display: flex; align-items: center; gap: 14px; padding: 9px 22px; background: white; border-bottom: 1px solid var(--line); }
.ribbon-group { display: flex; align-items: center; gap: 4px; }
.ribbon button { min-width: 70px; padding: 7px 10px; display: flex; flex-direction: column; align-items: center; gap: 3px; border: 0; border-radius: 7px; background: transparent; color: #435864; font-size: 10px; }
.ribbon button span { color: var(--green-dark); font-size: 20px; line-height: 1; }
.ribbon button:hover:not(:disabled) { background: var(--green-soft); color: var(--navy); }
.ribbon button:disabled { opacity: .35; cursor: not-allowed; }
.ribbon-separator { width: 1px; height: 38px; background: var(--line); }
.ribbon-hint { margin-left: auto; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.save-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.save-dot.saving { background: #e0a127; box-shadow: 0 0 0 3px var(--amber-soft); }
.save-dot.error { background: var(--red); box-shadow: 0 0 0 3px #fae8e8; }

.workbook { margin: 18px 20px 0; display: flex; flex: 1; min-height: 0; flex-direction: column; background: white; border: 1px solid var(--line-dark); border-radius: 9px 9px 0 0; overflow: hidden; box-shadow: 0 10px 30px rgba(16,36,52,.08); }
.formula-bar { min-height: 39px; display: grid; grid-template-columns: 76px 45px 1fr; align-items: stretch; border-bottom: 1px solid var(--line-dark); background: #fafbfb; }
.formula-bar label, .formula-bar .fx { display: grid; place-items: center; border-right: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.formula-bar .fx { color: var(--green-dark); font-family: Georgia, serif; font-style: italic; font-size: 16px; }
.formula-bar input { min-width: 0; padding: 0 12px; border: 0; outline: 0; background: white; color: var(--ink); }
.formula-bar input:focus { box-shadow: inset 0 0 0 2px var(--green); }
.sheet-toolbar { min-height: 65px; padding: 10px 13px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); }
.sheet-title { display: flex; align-items: center; gap: 10px; }
.sheet-title > span:last-child { display: flex; flex-direction: column; gap: 3px; }
.sheet-title strong { font-size: 15px; color: var(--navy); }
.sheet-title small { color: var(--muted); font-size: 10px; }
.sheet-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: var(--green-soft); color: var(--green-dark); font-size: 20px; }
.filters { display: flex; gap: 8px; }
.search-field { display: flex; align-items: center; gap: 7px; min-width: 240px; height: 35px; padding: 0 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); }
.search-field:focus-within { border-color: var(--green); box-shadow: 0 0 0 2px var(--green-soft); }
.search-field input { width: 100%; border: 0; outline: 0; color: var(--ink); }
.filters select { min-width: 150px; border: 1px solid var(--line); border-radius: 7px; padding: 0 9px; color: var(--ink); background: white; outline: 0; }
.summary-cards { display: grid; grid-template-columns: repeat(5, 1fr); border-bottom: 1px solid var(--line); background: #f8faf9; }
.summary-cards article { min-width: 0; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; column-gap: 12px; padding: 11px 15px; border-right: 1px solid var(--line); }
.summary-cards article:last-child { border-right: 0; }
.summary-cards small { align-self: end; color: var(--muted); font-size: 9px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.summary-cards strong { grid-row: 1 / 3; grid-column: 2; align-self: center; color: var(--navy); font-size: 20px; letter-spacing: -.03em; }
.summary-cards span { color: #8b999f; font-size: 9px; }
.summary-cards .selection-kpi { background: var(--green-soft); }
.summary-cards .selection-kpi strong { color: var(--green-dark); }

.table-wrap { position: relative; flex: 1; min-height: 320px; overflow: auto; background: white; }
.data-grid { width: 100%; min-width: 1560px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 12px; }
.data-grid th, .data-grid td { height: 36px; padding: 0 9px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.data-grid thead th { position: sticky; top: 0; z-index: 4; height: 44px; background: #f1f4f5; color: #6f8089; text-align: left; font-size: 10px; font-weight: 750; letter-spacing: .02em; user-select: none; }
.data-grid thead th[data-sort] { cursor: pointer; }
.data-grid thead th span { display: block; margin-top: 2px; color: var(--ink); font-size: 11px; letter-spacing: 0; }
.data-grid th:nth-child(1), .data-grid td:nth-child(1) { width: 40px; }
.data-grid th:nth-child(2), .data-grid td:nth-child(2) { width: 48px; }
.data-grid th:nth-child(3), .data-grid td:nth-child(3) { width: 165px; }
.data-grid th:nth-child(4), .data-grid td:nth-child(4) { width: 185px; }
.data-grid th:nth-child(5), .data-grid td:nth-child(5) { width: 210px; }
.data-grid th:nth-child(6), .data-grid td:nth-child(6) { width: 145px; }
.data-grid th:nth-child(7), .data-grid td:nth-child(7) { width: 115px; }
.data-grid th:nth-child(8), .data-grid td:nth-child(8) { width: 90px; }
.data-grid th:nth-child(9), .data-grid td:nth-child(9) { width: 110px; }
.data-grid th:nth-child(10), .data-grid td:nth-child(10) { width: 120px; }
.data-grid th:nth-child(11), .data-grid td:nth-child(11) { width: 110px; }
.data-grid th:nth-child(12), .data-grid td:nth-child(12) { width: 240px; }
.data-grid td { position: relative; background: white; color: #304650; }
.data-grid tbody tr:hover td { background: #f8fbfa; }
.data-grid tbody tr.selected-row td { background: #f0f8f4; }
.data-grid .row-selector, .data-grid .row-number { position: sticky; z-index: 2; background: #f3f5f6; text-align: center; color: #71828b; }
.data-grid .row-selector { left: 0; }
.data-grid .row-number { left: 40px; }
.data-grid thead .row-selector, .data-grid thead .row-number { z-index: 6; }
.data-grid td.cell-active { outline: 2px solid var(--green); outline-offset: -2px; z-index: 1; background: white !important; }
.data-grid td.cell-active::after { content: ""; position: absolute; right: -1px; bottom: -1px; width: 5px; height: 5px; background: var(--green); }
.data-grid td.numeric, .data-grid th.numeric { text-align: right; }
.data-grid td.computed { background: #f8faf9; color: var(--navy); font-weight: 700; }
.data-grid td.editable { cursor: cell; }
.data-grid td.readonly-cell { cursor: default; }
.data-grid th.permission-locked { background: #e1e5e7; color: #98a4aa; }
.data-grid th.permission-locked span { color: #74838b; }
.data-grid td.permission-locked { background: #eef0f1; color: #89959c; cursor: not-allowed; box-shadow: inset 3px 0 #d8dde0; }
.data-grid tbody tr:hover td.permission-locked { background: #e7eaec; }
.data-grid input.cell-editor, .data-grid select.cell-editor { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0 8px; border: 2px solid var(--green); border-radius: 0; outline: 0; background: white; color: var(--ink); z-index: 3; }
.status-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 99px; font-size: 10px; font-weight: 750; }
.status-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-neu { background: #eef1f3; color: #60727c; }
.status-offen { background: var(--amber-soft); color: #916212; }
.status-aktiv { background: var(--green-soft); color: var(--green-dark); }
.status-pruefung { background: var(--blue-soft); color: #39729a; }
.status-abgeschlossen { background: #e9edf7; color: #526595; }
.status-pausiert { background: #f4eafa; color: #80519c; }
.empty-state { padding: 60px; color: var(--muted); text-align: center; }
.statusbar { min-height: 30px; display: flex; align-items: center; gap: 20px; padding: 0 12px; border-top: 1px solid var(--line); background: #f7f9f9; color: var(--muted); font-size: 10px; }
.statusbar strong { color: var(--navy); }
.role-status { margin-left: auto; }
.sheet-tabs { min-height: 39px; display: flex; align-items: end; gap: 2px; padding: 0 10px; border-top: 1px solid var(--line); background: #edf1f2; }
.sheet-tab, .add-sheet { height: 31px; padding: 0 19px; border: 0; border-radius: 5px 5px 0 0; background: #e2e8ea; color: #51656f; font-size: 11px; }
.sheet-tab.active { background: white; color: var(--green-dark); box-shadow: inset 0 3px 0 var(--green); font-weight: 750; }
.add-sheet { width: 36px; padding: 0; background: transparent; font-size: 18px; }

.rights-sheet { flex: 1; margin: 18px 20px 0; padding: clamp(24px, 4vw, 55px); border: 1px solid var(--line); border-radius: 9px; background: white; box-shadow: 0 10px 30px rgba(16,36,52,.08); }
.rights-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.rights-heading > span { display: flex; flex-direction: column; gap: 6px; }
.rights-heading small { color: var(--green-dark); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rights-heading strong { color: var(--navy); font-size: clamp(23px, 3vw, 36px); letter-spacing: -.035em; }
.rights-heading p { max-width: 520px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.rights-users { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 24px 0; }
.rights-user { position: relative; display: flex; align-items: center; gap: 12px; padding: 15px; border: 1px solid var(--line); border-radius: 11px; }
.rights-user.current { border-color: var(--green); background: var(--green-soft); }
.rights-user > div { display: flex; flex-direction: column; gap: 3px; }
.rights-user strong { font-size: 13px; }
.rights-user div span { color: var(--muted); font-size: 11px; }
.rights-user em { margin-left: auto; color: var(--green-dark); font-size: 10px; font-style: normal; font-weight: 800; text-transform: uppercase; }
.rights-matrix-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.rights-matrix { width: 100%; min-width: 700px; border-collapse: collapse; font-size: 12px; }
.rights-matrix th, .rights-matrix td { padding: 13px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: center; }
.rights-matrix th:first-child, .rights-matrix td:first-child { text-align: left; }
.rights-matrix th { background: #f3f6f6; color: var(--navy); }
.rights-matrix td:not(:first-child) { color: var(--green-dark); font-weight: 800; font-size: 15px; }
.switch-role-link { display: inline-flex; margin-top: 20px; color: var(--green-dark); font-size: 12px; font-weight: 750; text-decoration: none; }

.toast { position: fixed; right: 20px; bottom: 20px; z-index: 20; max-width: 380px; padding: 12px 15px; border-radius: 9px; background: var(--navy); color: white; box-shadow: var(--shadow); font-size: 12px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: .22s ease; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { background: #8e3434; }
dialog { width: min(520px, calc(100% - 30px)); border: 0; border-radius: 14px; padding: 30px; color: var(--ink); box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(16,36,52,.55); backdrop-filter: blur(3px); }
dialog h2 { color: var(--navy); margin: 10px 0 15px; }
dialog ul { margin: 0; padding-left: 20px; color: var(--muted); line-height: 1.8; font-size: 13px; }
.activity-dialog > p { margin: -7px 0 20px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.activity-list { display: grid; gap: 0; max-height: 420px; overflow: auto; border: 1px solid var(--line); border-radius: 9px; }
.activity-item { display: grid; grid-template-columns: 34px 1fr auto; align-items: start; gap: 10px; padding: 11px; border-bottom: 1px solid var(--line); }
.activity-item:last-child { border-bottom: 0; }
.activity-item .activity-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--green-soft); color: var(--green-dark); font-size: 14px; }
.activity-item > span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; }
.activity-item strong { color: var(--navy); font-size: 11px; }
.activity-item small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.activity-item time { color: #8b999f; font-size: 9px; white-space: nowrap; }
.activity-empty { padding: 35px; color: var(--muted); text-align: center; font-size: 12px; }
.dialog-close { position: absolute; right: 15px; top: 12px; border: 0; background: transparent; color: var(--muted); font-size: 24px; }
kbd { padding: 2px 5px; border: 1px solid var(--line-dark); border-bottom-width: 2px; border-radius: 4px; background: #f4f6f7; color: var(--ink); font: 11px "Segoe UI", sans-serif; }

@media (max-width: 1050px) {
    .login-shell { grid-template-columns: 1fr; }
    .login-card { max-width: 720px; }
    .login-visual { min-height: 560px; }
    .ribbon-hint { display: none; }
}

@media (max-width: 720px) {
    .login-card { padding: 28px 18px 40px; }
    .login-copy { margin: 45px 0 25px; }
    .login-copy h1 { font-size: 44px; }
    .login-visual { min-height: 430px; padding: 55px 18px; }
    .role-login-text small { display: none; }
    .topbar { height: 58px; padding: 0 12px; }
    .topbar .brand-lockup small, .database-badge { display: none; }
    .brand-logo-header { width: 82px; }
    .topbar .brand-lockup.compact > span:last-child { padding-left: 10px; }
    .role-switcher span { display: none; }
    .role-switcher select { width: 165px; }
    .ribbon { padding: 7px 8px; overflow-x: auto; }
    .ribbon button { min-width: 62px; }
    .workbook, .rights-sheet { margin: 10px 7px 0; }
    .sheet-toolbar { align-items: stretch; flex-direction: column; }
    .filters { width: 100%; }
    .search-field { min-width: 0; flex: 1; }
    .filters select { min-width: 120px; }
    .statusbar { gap: 10px; overflow-x: auto; white-space: nowrap; }
    .role-status { margin-left: 0; }
    .summary-cards { grid-template-columns: repeat(2, 1fr); }
    .summary-cards article:nth-child(even) { border-right: 0; }
    .summary-cards article:not(:last-child) { border-bottom: 1px solid var(--line); }
    .rights-heading { align-items: start; flex-direction: column; }
    .rights-users { grid-template-columns: 1fr; }
}
