
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Inter,sans-serif;
}

body{
display:flex;
background:#f1f5f9;
color:#0f172a;
}

.hidden{
display:none !important;
}

body:not(.auth-ready):not(.auth-body):not(.ticket-public-body) .sidebar,
body:not(.auth-ready):not(.auth-body):not(.ticket-public-body) .content{
visibility:hidden;
}

[data-requires-manager],
[data-requires-admin]{
display:none !important;
}

body.auth-ready [data-requires-manager]:not(.hidden),
body.auth-ready [data-requires-admin]:not(.hidden){
display:block !important;
}

.sidebar{
width:280px;
height:100vh;
background:#0f172a;
color:white;
padding:24px;
position:fixed;
left:0;
top:0;
display:flex;
flex-direction:column;
overflow-y:auto;
}

.logo-img{
width:180px;
display:block;
margin:0 auto 30px auto;
border-radius:10px;
background:white;
padding:12px;
box-shadow:0 8px 20px rgba(0,0,0,.18);
}

.nav{
display:flex;
flex-direction:column;
gap:8px;
padding-bottom:18px;
}

.nav a{
text-decoration:none;
color:white;
padding:13px 16px;
border-radius:14px;
display:block;
transition:0.2s;
flex-shrink:0;
}

.nav a:hover,
.nav a.active{
background:#1e293b;
}

.account-panel{
margin-top:auto;
padding-top:18px;
border-top:1px solid #1e293b;
display:grid;
grid-template-columns:42px 1fr;
gap:12px;
align-items:center;
flex-shrink:0;
}

.account-panel span{
display:block;
color:#94a3b8;
font-size:13px;
margin-top:2px;
}

.account-avatar{
width:42px;
height:42px;
border-radius:50%;
background:#dbeafe;
color:#0f172a;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
}

.logout-button{
grid-column:1 / -1;
background:#1e293b;
color:#cbd5e1;
padding:10px 12px;
border-radius:10px;
font-size:13px;
}

.content{
margin-left:280px;
width:100%;
padding:40px;
}

.page-head{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:24px;
margin-bottom:28px;
}

.page-actions{
display:flex;
align-items:center;
gap:10px;
}

.button-group{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
}

.button-group select{
width:auto;
min-width:180px;
}

.page-title{
font-size:42px;
margin-bottom:8px;
}

.subtitle{
color:#64748b;
margin-bottom:30px;
}

.cards{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-bottom:24px;
}

.apartment-stats{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;
margin-bottom:24px;
}

.card{
background:white;
padding:24px;
border-radius:20px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.card span{
color:#64748b;
}

.card h2{
font-size:42px;
margin-top:10px;
}

.stat-card{
padding:22px;
}

.stat-card h2{
font-size:36px;
}

.stat-label{
display:inline-flex;
align-items:center;
gap:8px;
}

.stat-icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:28px;
height:28px;
border-radius:8px;
background:#f1f5f9;
font-size:15px;
}

.box{
background:white;
padding:24px;
border-radius:20px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
margin-bottom:30px;
}

.box-header{
display:flex;
justify-content:space-between;
align-items:center;
min-height:38px;
margin-bottom:18px;
}

.overview-header{
align-items:flex-start;
}

.box-subtitle{
color:#64748b;
font-size:14px;
margin-top:6px;
}

button{
border:none;
background:#2563eb;
color:white;
padding:12px 18px;
border-radius:14px;
cursor:pointer;
}

button:disabled{
opacity:.65;
cursor:not-allowed;
}

.button-link{
display:inline-flex;
align-items:center;
justify-content:center;
background:#2563eb;
color:white;
padding:12px 18px;
border-radius:14px;
text-decoration:none;
font-weight:600;
}

table{
width:100%;
border-collapse:collapse;
}

th{
text-align:left;
padding-bottom:14px;
border-bottom:1px solid #e2e8f0;
}

td{
padding:16px 0;
border-bottom:1px solid #f1f5f9;
}

.status{
padding:8px 14px;
border-radius:999px;
font-size:14px;
font-weight:500;
}

.green{
background:#dcfce7;
color:#15803d;
}

.yellow{
background:#fef3c7;
color:#a16207;
}

.red{
background:#fee2e2;
color:#b91c1c;
}

.modal{
position:fixed;
inset:0;
background:rgba(0,0,0,0.5);
display:none;
justify-content:center;
align-items:center;
z-index:5000;
padding:18px;
}

.modal-content{
background:white;
padding:30px;
border-radius:24px;
width:500px;
max-height:90vh;
overflow:auto;
position:relative;
z-index:5001;
}

.modal-content h3{
margin-bottom:20px;
}

.modal-title-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:20px;
}

.modal-title-row h3{
margin-bottom:0;
}

.form-group{
margin-bottom:16px;
}

input, select{
width:100%;
padding:12px;
border:1px solid #cbd5e1;
border-radius:12px;
}

input:disabled,
select:disabled,
textarea:disabled{
background:#f8fafc;
color:#0f172a;
opacity:1;
cursor:default;
}

textarea{
width:100%;
padding:12px;
border:1px solid #cbd5e1;
border-radius:12px;
resize:vertical;
font-family:inherit;
}

label{
display:block;
font-size:14px;
font-weight:500;
margin-bottom:8px;
}

.form-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
}

.checkbox-grid{
display:flex;
flex-wrap:wrap;
gap:16px;
margin-top:8px;
}

.checkbox-grid label{
display:inline-flex;
align-items:center;
gap:8px;
font-weight:500;
}

.form-section-title{
font-size:14px;
font-weight:700;
color:#0f172a;
padding-top:10px;
margin:6px 0 16px 0;
border-top:1px solid #e2e8f0;
}

.modal-actions{
display:flex;
justify-content:flex-end;
gap:12px;
margin-top:20px;
}

.secondary{
background:#64748b;
}

.pagination .active{
background:#3b82f6 !important;
color:white !important;
}

.primary{
background:#3b82f6;
color:white;
}

.pagination{
display:flex;
gap:8px;
margin-top:16px;
justify-content:center;
}

.topbar{
height:70px;
background:white;
border-bottom:1px solid #e2e8f0;
display:flex;
align-items:center;
justify-content:space-between;
padding:0 30px;
margin:-40px -40px 30px -40px;
}

.topbar-left{
display:flex;
align-items:center;
gap:18px;
}

.hamburger{
font-size:28px;
font-weight:bold;
}

.userbox{
display:flex;
align-items:center;
gap:12px;
}

.ticket-alert{
display:inline-flex;
align-items:center;
gap:10px;
padding:10px 12px;
border-radius:12px;
background:#fee2e2;
color:#991b1b;
text-decoration:none;
font-weight:800;
border:1px solid #fecaca;
}

body.auth-ready .ticket-alert[data-requires-manager]:not(.hidden){
display:inline-flex !important;
}

.ticket-alert span{
font-size:13px;
}

.ticket-alert strong{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:28px;
height:28px;
border-radius:999px;
background:#dc2626;
color:#fff;
font-size:15px;
}

.user-avatar{
width:42px;
height:42px;
border-radius:50%;
background:#dbeafe;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
}

.auth-body{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
background:#0f172a;
padding:24px;
}

.auth-shell{
width:100%;
max-width:460px;
}

.auth-card{
background:white;
border-radius:20px;
padding:30px;
box-shadow:0 24px 80px rgba(0,0,0,0.28);
}

.auth-logo{
width:150px;
display:block;
margin:0 auto 22px auto;
border-radius:18px;
background:white;
}

.auth-tabs{
display:grid;
grid-template-columns:1fr 1fr;
gap:8px;
padding:6px;
background:#f1f5f9;
border-radius:14px;
margin-bottom:24px;
}

.auth-tab{
background:transparent;
color:#64748b;
border-radius:10px;
padding:10px 12px;
}

.auth-tab.active{
background:#0f172a;
color:white;
}

.auth-card h1{
font-size:30px;
margin-bottom:8px;
}

.auth-alt-link{
margin-top:16px;
font-size:14px;
}

.auth-alt-link a{
color:#1d4ed8;
font-weight:700;
text-decoration:none;
}

.form-message{
min-height:20px;
color:#b91c1c;
font-size:14px;
margin-bottom:12px;
}

.form-message.success{
color:#1d4ed8;
font-weight:700;
}

.dashboard-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:20px;
margin-bottom:20px;
}

.dashboard-main-grid{
grid-template-columns:minmax(520px,1.45fr) minmax(300px,.85fr);
}

.info-row{
display:flex;
justify-content:space-between;
align-items:center;
}

.badge{
padding:6px 12px;
border-radius:999px;
font-size:13px;
font-weight:600;
}

.blue{
background:#dbeafe;
color:#1d4ed8;
}

.gray{
background:#e5e7eb;
color:#374151;
}

.actions{
display:flex;
gap:12px;
font-size:18px;
}

.table-actions{
display:flex;
gap:8px;
align-items:center;
}

.icon-button{
width:36px;
height:36px;
padding:0;
border-radius:10px;
background:#e0f2fe;
color:#0369a1;
font-size:15px;
display:inline-flex;
align-items:center;
justify-content:center;
}

.icon-button.danger{
background:#fee2e2;
color:#b91c1c;
}

.icon-button.success{
background:#dcfce7;
color:#15803d;
}

.key-balance-off{
background:#fff1f2;
}

.key-balance-off td{
border-bottom-color:#fecdd3;
}

.key-balance-note{
display:block;
margin-top:4px;
font-size:12px;
font-weight:700;
color:#b91c1c;
}

.key-stock-warning{
background:#fee2e2 !important;
color:#b91c1c !important;
border-color:#fecaca !important;
font-weight:800;
}

.key-number-button{
display:inline-flex;
align-items:center;
justify-content:flex-start;
width:auto;
max-width:100%;
padding:0;
border:0;
border-radius:0;
background:transparent;
color:inherit;
box-shadow:none;
text-align:left;
font:inherit;
cursor:pointer;
}

.key-number-button:hover{
background:transparent;
color:inherit;
text-decoration:none;
box-shadow:none;
transform:none;
}

.key-holders-modal{
width:min(920px,calc(100vw - 36px));
}

.key-management-modal{
width:min(860px,calc(100vw - 36px));
}

.key-management-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
align-items:start;
}

.key-management-option{
padding:16px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
}

.key-management-option h4{
margin:0 0 8px;
}

.key-stock-change-row{
align-items:end;
}

.key-holder-summary{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:12px;
margin-bottom:18px;
}

.key-holder-summary div{
padding:14px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
}

.key-holder-summary span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:6px;
}

.key-holder-summary strong{
font-size:24px;
}

.settings-layout{
display:grid;
grid-template-columns:220px minmax(0,1fr);
gap:18px;
align-items:start;
}

.settings-nav-panel{
position:sticky;
top:22px;
display:flex;
flex-direction:column;
gap:8px;
padding:10px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
}

.settings-nav-button{
width:100%;
justify-content:flex-start;
text-align:left;
background:transparent;
color:#334155;
border-color:transparent;
box-shadow:none;
}

.settings-nav-button:hover,
.settings-nav-button.active{
background:#eff6ff;
color:#1d4ed8;
box-shadow:none;
transform:none;
}

.settings-content{
min-width:0;
}

.settings-group{
display:grid;
gap:14px;
}

.settings-group h4{
margin:0 0 4px;
}

.settings-inline-form{
display:grid;
grid-template-columns:minmax(260px,1fr) auto;
gap:12px;
align-items:end;
}

.settings-inline-form.compact{
grid-template-columns:minmax(160px,1fr) auto;
align-items:center;
}

.settings-group-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
align-items:start;
}

.settings-list-card{
display:grid;
gap:12px;
padding:16px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
}

.settings-list-card h4{
margin:0;
}

.settings-tag-list{
display:grid;
gap:8px;
}

.settings-tag-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:10px 12px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
}

.settings-tag-row.dragging{
opacity:.55;
}

.settings-tag-row.drag-over{
border-color:#2563eb;
box-shadow:var(--ring);
}

.settings-tag-main{
display:flex;
align-items:center;
gap:8px;
min-width:0;
}

.settings-drag-handle{
display:inline-flex;
align-items:center;
justify-content:center;
width:18px;
height:26px;
border:0;
border-radius:4px;
background:transparent;
color:#94a3b8;
cursor:grab;
opacity:.35;
transition:opacity .18s ease, color .18s ease, background .18s ease;
}

.settings-drag-handle::before{
content:"";
width:10px;
height:18px;
background:
 radial-gradient(currentColor 1.2px, transparent 1.4px) 0 0 / 5px 6px,
 radial-gradient(currentColor 1.2px, transparent 1.4px) 5px 0 / 5px 6px;
}

.settings-tag-row:active .settings-drag-handle{
cursor:grabbing;
}

.settings-tag-row:hover .settings-drag-handle{
opacity:.75;
color:#64748b;
}

.settings-tag-main span:last-child{
font-weight:700;
}

.settings-row-actions{
display:flex;
align-items:center;
gap:6px;
}

.settings-row-actions button{
padding:8px 10px;
}

.settings-empty{
margin-top:16px;
}

.settings-system-form{
display:grid;
gap:14px;
}

.status-dot{
display:inline-block;
width:10px;
height:10px;
border-radius:50%;
margin-left:6px;
vertical-align:middle;
}

.status-dot-red{
background:#dc2626;
}

.inventory-check-cell{
text-align:center;
}

.key-fully-assigned{
background:#fffbeb;
}

.key-fully-assigned td{
border-bottom-color:#fde68a;
}

.key-cockpit{
margin-bottom:20px;
}

.key-cockpit-alerts{
display:grid;
grid-template-columns:repeat(4,minmax(150px,1fr));
gap:14px;
margin-bottom:18px;
}

.key-alert-card{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:7px;
min-height:116px;
padding:16px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
color:var(--text,#0f172a);
box-shadow:inset 4px 0 0 var(--primary,#2563eb);
text-align:left;
}

.key-alert-card span,
.key-alert-card small{
color:var(--muted,#64748b);
font-size:13px;
font-weight:700;
}

.key-alert-card strong{
font-size:30px;
line-height:1;
}

.key-alert-card.ok{
box-shadow:inset 4px 0 0 #16a34a;
}

.key-alert-card.warning{
box-shadow:inset 4px 0 0 #d97706;
}

.key-alert-card.danger{
box-shadow:inset 4px 0 0 #dc2626;
}

.key-workflow-bar{
display:grid;
grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) minmax(240px,1.4fr) auto;
gap:14px;
align-items:end;
padding:16px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
margin-bottom:18px;
}

.key-cockpit-focus{
display:grid;
grid-template-columns:minmax(360px,1.2fr) minmax(280px,.8fr);
gap:16px;
align-items:start;
}

.key-unit-panel,
.key-task-panel{
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface,#fff);
padding:16px;
}

.key-unit-head,
.key-task-panel-head{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:14px;
margin-bottom:12px;
}

.key-unit-head span,
.key-task-panel-head span,
.key-unit-meta span{
display:block;
color:var(--muted,#64748b);
font-size:13px;
}

.key-unit-head strong{
display:block;
font-size:22px;
margin-top:4px;
}

.key-unit-meta{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
margin-bottom:16px;
}

.key-unit-meta span{
padding:9px 10px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

.key-unit-columns{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
}

.key-unit-columns > div > strong{
display:block;
margin-bottom:8px;
font-size:14px;
}

.key-mini-row,
.key-task-item{
width:100%;
display:flex;
flex-direction:column;
align-items:flex-start;
gap:4px;
padding:10px 12px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
color:var(--text,#0f172a);
text-align:left;
margin-bottom:8px;
}

.key-mini-row span,
.key-task-item span{
color:var(--muted-strong,#475569);
font-size:13px;
line-height:1.35;
}

.key-mini-row small{
color:var(--muted,#64748b);
font-size:12px;
line-height:1.35;
}

.key-task-list{
display:flex;
flex-direction:column;
gap:0;
max-height:430px;
overflow:auto;
}

.key-task-item{
box-shadow:inset 4px 0 0 var(--primary,#2563eb);
}

.key-task-item.warning{
box-shadow:inset 4px 0 0 #d97706;
}

.key-task-item.danger{
box-shadow:inset 4px 0 0 #dc2626;
}

.key-task-empty{
padding:18px;
border:1px dashed var(--border,#cbd5e1);
border-radius:8px;
color:var(--muted,#64748b);
background:var(--surface-soft,#f8fafc);
}

.key-audit-summary{
display:grid;
grid-template-columns:repeat(3,minmax(140px,1fr));
gap:14px;
margin-bottom:18px;
}

.key-audit-summary div{
padding:16px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
box-shadow:inset 4px 0 0 #3b82f6;
}

.key-audit-summary span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:8px;
}

.key-audit-summary strong{
font-size:26px;
}

.key-audit-row-issue{
background:#fff7f7;
}

.key-audit-answer-list{
display:flex;
flex-wrap:wrap;
gap:6px;
margin-top:8px;
}

.key-audit-answer-list span{
padding:5px 8px;
border-radius:999px;
background:#f1f5f9;
font-size:12px;
font-weight:700;
color:#334155;
}

.key-audit-answer-list .key-audit-answer-issue{
background:#fee2e2;
color:#991b1b;
}

.key-audit-note{
display:block;
margin-top:8px;
color:#64748b;
line-height:1.35;
}

.key-issue-grid{
grid-template-columns:minmax(420px,1.1fr) minmax(260px,.9fr);
align-items:start;
}

.key-issue-summary{
display:grid;
grid-template-columns:repeat(2,minmax(120px,1fr));
gap:14px;
}

.key-issue-summary div{
padding:16px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
box-shadow:inset 4px 0 0 #2563eb;
}

.key-issue-summary span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:8px;
}

.key-issue-summary strong{
font-size:26px;
}

.key-issue-hint{
display:flex;
flex-wrap:wrap;
gap:10px;
align-items:center;
margin:4px 0 10px;
font-size:13px;
color:#64748b;
}

.key-issue-hint span{
padding:7px 10px;
border-radius:999px;
background:#f1f5f9;
}

.protocol-builder{
padding:20px;
border:1px solid #cbd5e1;
border-radius:8px;
background:#fff;
margin-bottom:30px;
box-shadow:0 10px 24px rgba(15,23,42,0.06);
}

.protocol-section-heading{
display:block;
padding:14px 16px;
margin:26px 0 0;
background:#e0f2fe;
border:1px solid #7dd3fc;
border-bottom:0;
border-radius:8px 8px 0 0;
}

.protocol-section-heading h4{
margin:0 0 4px;
font-size:16px;
color:#0f172a;
}

.protocol-section-heading p{
margin:0;
font-size:13px;
color:#475569;
}

.protocol-section-heading + .protocol-builder{
border-top-left-radius:0;
border-top-right-radius:0;
margin-top:0;
}

.protocol-builder-craftsman{
background:#fffdf5;
border-color:#facc15;
}

.protocol-mode-switch{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:6px;
padding:4px;
border:1px solid var(--border,#dbe3ec);
border-radius:8px;
background:var(--surface-soft,#eef2f7);
margin-bottom:16px;
}

.protocol-mode-switch button{
box-shadow:none;
background:transparent;
color:var(--muted-strong,#475569);
}

.protocol-mode-switch button.active{
background:var(--heading,#0f172a);
color:var(--surface,#fff);
}

.protocol-add-row{
display:grid;
grid-template-columns:minmax(260px,1fr) 120px auto;
gap:12px;
align-items:center;
margin-bottom:14px;
}

.protocol-add-row .form-group{
margin-bottom:0;
}

.protocol-selected-list{
display:grid;
gap:10px;
margin:8px 0 16px;
}

.protocol-selected-row{
display:grid;
grid-template-columns:minmax(0,1fr) 90px auto;
gap:10px;
align-items:center;
padding:12px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
}

.protocol-signer-row{
grid-template-columns:minmax(0,1fr) auto;
}

.protocol-signature-grid{
display:grid;
grid-template-columns:minmax(240px,.8fr) minmax(320px,1.2fr);
gap:16px;
align-items:start;
}

.protocol-tenant-signers .protocol-add-row{
grid-template-columns:minmax(220px,1fr) auto;
}

.protocol-selected-row div{
display:flex;
flex-direction:column;
gap:2px;
min-width:0;
}

.protocol-selected-row span{
color:#64748b;
font-size:13px;
}

.key-protocol-tool-grid{
grid-template-columns:minmax(520px,1.1fr) minmax(280px,.9fr);
}

.protocol-tool-summary{
display:flex;
flex-direction:column;
gap:14px;
}

.protocol-tool-summary-head{
padding:14px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
}

.protocol-tool-summary-head strong,
.protocol-tool-summary-head span{
display:block;
}

.protocol-tool-summary-head span{
margin-top:5px;
font-size:13px;
color:var(--muted,#64748b);
}

.protocol-tool-summary-list{
display:flex;
flex-direction:column;
gap:8px;
}

.protocol-tool-summary-list span{
display:block;
padding:10px 12px;
border:1px solid var(--border,#e2e8f0);
border-radius:8px;
background:var(--surface-soft,#f8fafc);
font-size:13px;
color:var(--muted-strong,#475569);
}

.file-action::before{
content:"";
width:15px;
height:18px;
display:block;
background:currentColor;
clip-path:polygon(0 0,68% 0,100% 32%,100% 100%,0 100%);
}

.file-action::after{
content:"";
position:absolute;
width:7px;
height:7px;
margin-left:8px;
margin-top:-9px;
background:#e0f2fe;
clip-path:polygon(0 0,100% 100%,0 100%);
}

.file-action{
position:relative;
}

.footer-sync{
background:#0f172a;
color:white;
padding:22px;
border-radius:22px;
display:flex;
justify-content:space-between;
align-items:center;
margin-top:30px;
}

.sync-badge{
background:#2563eb;
padding:8px 16px;
border-radius:999px;
}

.quick-grid{
display:grid;
grid-template-columns:minmax(420px,1.2fr) minmax(280px,.8fr);
gap:20px;
margin-top:20px;
}

.dashboard-statistics{
margin-top:20px;
}

.dashboard-stat-grid{
display:grid;
grid-template-columns:repeat(4,minmax(160px,1fr));
gap:14px;
}

.dashboard-stat-grid div{
padding:16px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
box-shadow:inset 4px 0 0 #cbd5e1;
min-height:92px;
}

.dashboard-stat-grid div:nth-child(1){
box-shadow:inset 4px 0 0 #2563eb;
}

.dashboard-stat-grid div:nth-child(2){
box-shadow:inset 4px 0 0 #0ea5e9;
}

.dashboard-stat-grid div:nth-child(3){
box-shadow:inset 4px 0 0 #a855f7;
}

.dashboard-stat-grid div:nth-child(4){
box-shadow:inset 4px 0 0 #ef4444;
}

.dashboard-stat-grid span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:8px;
}

.dashboard-stat-grid strong{
font-size:24px;
line-height:1.1;
}

.subtabs{
display:flex;
gap:10px;
margin-bottom:18px;
}

.subtabs button{
background:#e5e7eb;
color:#334155;
border-radius:999px;
padding:10px 16px;
font-weight:600;
}

.subtabs button.active{
background:#0f172a;
color:#fff;
}

.measure-list{
display:flex;
flex-direction:column;
border-top:1px solid #e2e8f0;
}

.measure-row{
padding:16px 0;
border-bottom:1px solid #f1f5f9;
}

.measure-row.compact{
color:#0f172a;
line-height:1.4;
}

.dashboard-measure-link{
display:inline-flex;
flex-direction:column;
gap:4px;
color:#0f172a;
text-decoration:none;
padding:4px 6px;
margin-left:-6px;
border-radius:6px;
}

.dashboard-measure-link:hover{
background:#f1f5f9;
}

.dashboard-measure-link span{
color:#64748b;
font-size:14px;
}

.measure-toolbar{
display:grid;
grid-template-columns:minmax(260px,1fr) 190px 190px;
gap:14px;
margin-bottom:18px;
}

.measure-board{
display:grid;
grid-template-columns:repeat(3,minmax(240px,1fr));
gap:16px;
}

.measure-card{
display:flex;
flex-direction:column;
gap:14px;
padding:18px;
border:1px solid #e2e8f0;
border-left:5px solid #94a3b8;
border-radius:8px;
background:#fff;
box-shadow:0 8px 24px rgba(15,23,42,.05);
min-height:230px;
}

.measure-card.measure-overdue{
border-left-color:#dc2626;
background:#fff7f7;
}

.measure-card.measure-focused{
border-color:#3b82f6;
border-left-color:#3b82f6;
box-shadow:0 0 0 3px rgba(59,130,246,.18), 0 12px 28px rgba(15,23,42,.08);
}

.measure-card-head{
display:flex;
justify-content:space-between;
gap:14px;
align-items:flex-start;
}

.measure-card-head strong{
display:block;
font-size:18px;
line-height:1.25;
}

.measure-card-head span:not(.status){
display:block;
color:#64748b;
font-size:13px;
margin-top:5px;
}

.measure-card p{
color:#334155;
line-height:1.5;
font-size:14px;
}

.measure-meta{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px;
margin-top:auto;
font-size:13px;
color:#475569;
}

.measure-meta > span:not(.status){
padding:8px 10px;
background:#f8fafc;
border:1px solid #e2e8f0;
border-radius:6px;
min-height:34px;
display:flex;
align-items:center;
}

.measure-actions{
display:flex;
justify-content:flex-end;
align-items:center;
gap:8px;
padding-top:4px;
}

.ticket-public-body{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
background:#eef2f7;
padding:28px;
}

.ticket-public-shell{
width:100%;
max-width:980px;
}

.ticket-public-panel{
background:#fff;
border-radius:18px;
box-shadow:0 24px 80px rgba(15,23,42,.16);
padding:28px;
}

.ticket-public-brand{
display:flex;
align-items:center;
gap:18px;
padding-bottom:22px;
border-bottom:1px solid #e2e8f0;
margin-bottom:22px;
}

.ticket-public-brand img{
width:96px;
height:auto;
background:white;
border:1px solid #e2e8f0;
border-radius:10px;
padding:8px;
}

.ticket-public-brand h1{
font-size:32px;
line-height:1.1;
margin-bottom:8px;
}

.ticket-public-brand p{
color:#64748b;
}

.ticket-checkline{
display:flex;
align-items:flex-end;
}

.ticket-checkline label{
display:flex;
align-items:center;
gap:10px;
padding:12px;
border:1px solid #cbd5e1;
border-radius:12px;
width:100%;
margin:0;
}

.ticket-checkline input{
width:auto;
}

.ticket-public-actions{
display:flex;
justify-content:flex-end;
align-items:center;
gap:16px;
}

.key-audit-public-shell{
max-width:1080px;
}

.key-audit-code-action{
display:flex;
align-items:flex-end;
}

.key-audit-code-action button{
width:100%;
}

.key-audit-public-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:14px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
margin-bottom:16px;
}

.key-audit-public-head span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:4px;
}

.key-audit-public-list{
display:flex;
flex-direction:column;
gap:10px;
margin-bottom:18px;
}

.key-audit-public-row{
display:grid;
grid-template-columns:minmax(180px,1fr) 130px 130px;
gap:12px;
align-items:center;
padding:14px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
}

.key-audit-public-row-numbered{
grid-template-columns:minmax(180px,1fr) minmax(150px,.7fr) 130px 130px;
}

.key-audit-public-row strong{
display:block;
font-size:16px;
}

.key-audit-public-row span{
display:block;
color:#64748b;
font-size:13px;
margin-top:3px;
}

.key-audit-count-field,
.key-audit-number-field{
display:flex;
flex-direction:column;
gap:6px;
margin:0;
font-size:13px;
font-weight:700;
color:#475569;
}

.key-audit-count-field span,
.key-audit-number-field span{
margin:0;
font-size:12px;
font-weight:700;
color:#64748b;
}

.key-audit-success{
padding:28px;
border:1px solid #bbf7d0;
border-radius:10px;
background:#f0fdf4;
color:#14532d;
}

.key-audit-success h2{
font-size:28px;
margin-bottom:8px;
}

.ticket-toolbar{
display:grid;
grid-template-columns:minmax(260px,1fr) 190px 210px;
gap:14px;
margin-bottom:18px;
}

.ticket-board{
display:grid;
grid-template-columns:repeat(3,minmax(240px,1fr));
gap:16px;
}

.ticket-card{
display:flex;
flex-direction:column;
gap:12px;
padding:18px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
box-shadow:0 8px 24px rgba(15,23,42,.05);
min-height:260px;
}

.ticket-card-top,
.ticket-card-footer{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
}

.ticket-number{
font-size:13px;
font-weight:800;
color:#475569;
letter-spacing:0;
}

.ticket-card h3{
font-size:19px;
line-height:1.25;
}

.ticket-card p{
color:#334155;
line-height:1.45;
font-size:14px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
}

.ticket-meta{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
margin-top:auto;
}

.ticket-meta span{
padding:8px 10px;
background:#f8fafc;
border:1px solid #e2e8f0;
border-radius:6px;
font-size:13px;
color:#475569;
}

.ticket-modal{
width:780px;
}

.ticket-detail-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
margin-bottom:14px;
}

.ticket-detail-grid div,
.ticket-description-box{
border:1px solid #e2e8f0;
border-radius:8px;
padding:14px;
background:#f8fafc;
}

.ticket-detail-grid span,
.ticket-description-box span{
display:block;
font-size:13px;
color:#64748b;
margin-bottom:6px;
}

.ticket-description-box{
margin-bottom:16px;
}

.ticket-description-box p{
line-height:1.5;
color:#334155;
}

.ticket-modal-meta{
display:flex;
flex-wrap:wrap;
gap:10px;
color:#475569;
font-size:13px;
}

.ticket-modal-meta span{
padding:8px 10px;
background:#f1f5f9;
border-radius:6px;
}

.tool-panel{
overflow:hidden;
scroll-margin-top:24px;
}

.tool-jump-nav{
display:flex;
gap:6px;
flex-wrap:wrap;
margin:0 0 16px;
padding:4px;
background:#eef2f7;
border:1px solid #dbe3ec;
border-radius:8px;
width:max-content;
max-width:100%;
}

.tool-jump-nav a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:32px;
padding:6px 12px;
border-radius:6px;
background:transparent;
border:1px solid transparent;
color:#475569;
font-size:13px;
font-weight:700;
text-decoration:none;
}

.tool-jump-nav a:hover{
background:#fff;
border-color:#cbd5e1;
color:#0f172a;
box-shadow:0 4px 12px rgba(15,23,42,0.08);
}

.scroll-top-button{
position:fixed;
right:22px;
bottom:22px;
width:42px;
height:42px;
border-radius:999px;
border:1px solid #cbd5e1;
background:#0f172a;
color:#fff;
font-size:20px;
font-weight:800;
box-shadow:0 14px 30px rgba(15,23,42,0.24);
z-index:30;
opacity:0;
pointer-events:none;
transform:translateY(8px);
transition:opacity .18s ease, transform .18s ease;
}

.scroll-top-button.visible{
opacity:1;
pointer-events:auto;
transform:translateY(0);
}

.scroll-top-button:hover{
background:#1d4ed8;
}

.global-search-panel{
position:relative;
z-index:20;
margin:0 0 18px;
max-width:760px;
}

.topbar-search-panel{
flex:0 1 320px;
max-width:360px;
margin:0 14px;
}

.page-head-search-panel{
width:min(100%,360px);
margin:0 0 0 auto;
}

.global-search-field{
background:#fff;
border:1px solid #dbe3ec;
box-shadow:0 8px 18px rgba(15,23,42,0.06);
}

.topbar-search-panel .global-search-field,
.page-head-search-panel .global-search-field{
box-shadow:none;
background:rgba(148,163,184,.10);
border-color:transparent;
border-radius:8px;
height:40px;
display:flex;
align-items:center;
}

.topbar-search-panel .global-search-field input,
.page-head-search-panel .global-search-field input{
height:38px;
border:0;
background:transparent;
padding-top:8px;
padding-bottom:8px;
}

.global-search-results{
position:absolute;
left:0;
right:0;
top:calc(100% + 6px);
display:grid;
gap:6px;
padding:8px;
background:#fff;
border:1px solid #dbe3ec;
border-radius:8px;
box-shadow:0 18px 42px rgba(15,23,42,0.18);
}

.global-search-result{
display:grid;
grid-template-columns:90px minmax(0,1fr);
gap:2px 10px;
align-items:center;
text-align:left;
padding:9px 10px;
border:0;
border-radius:7px;
background:#f8fafc;
color:#0f172a;
cursor:pointer;
}

.global-search-result:hover{
background:#eff6ff;
}

.global-search-result span{
grid-row:1 / span 2;
font-size:12px;
font-weight:800;
color:#2563eb;
}

.global-search-result strong,
.global-search-result small{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

.global-search-result small,
.global-search-empty{
color:#64748b;
font-size:13px;
}

.dashboard-today-box{
margin-bottom:22px;
}

.today-list{
display:grid;
gap:8px;
}

.today-empty{
padding:13px 12px;
border:1px dashed var(--border);
border-radius:8px;
background:var(--surface-soft);
color:var(--muted);
line-height:1.4;
}

.today-item{
display:grid;
grid-template-columns:95px minmax(0,1fr);
gap:2px 12px;
padding:11px 12px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
text-decoration:none;
color:#0f172a;
}

.today-item:hover{
border-color:#93c5fd;
background:#eff6ff;
}

.today-item span{
grid-row:1 / span 2;
font-weight:800;
font-size:12px;
color:#1d4ed8;
}

.today-item small{
color:#64748b;
}

.key-inventory-panel{
margin-top:24px;
padding:18px;
border:1px solid #cbd5e1;
border-radius:8px;
background:#fff;
box-shadow:0 10px 24px rgba(15,23,42,0.06);
}

.inventory-count-input{
max-width:90px;
}

.tool-size-badge{
padding:9px 12px;
border-radius:999px;
background:#0f172a;
color:#fff;
font-weight:800;
font-size:13px;
white-space:nowrap;
}

.tool-grid{
display:grid;
grid-template-columns:minmax(320px,.85fr) minmax(420px,1.15fr);
gap:22px;
align-items:start;
}

.tool-controls{
padding:18px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#f8fafc;
}

.tool-actions{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.tool-preview{
padding:18px;
border:1px solid #e2e8f0;
border-radius:8px;
background:#fff;
min-height:320px;
}

.tool-preview-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
margin-bottom:16px;
}

.tool-preview-head span{
color:#64748b;
font-size:13px;
font-weight:700;
}

.bell-label-preview{
display:flex;
align-content:flex-start;
align-items:flex-start;
flex-wrap:wrap;
gap:0;
padding:16px;
background:#f8fafc;
border:1px dashed #cbd5e1;
border-radius:8px;
min-height:220px;
overflow:auto;
}

.bell-label{
border:1px solid #000;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
overflow:hidden;
padding:4px 8px;
background:#fff;
color:#000;
flex:0 0 auto;
}

.bell-label-small{
width:5cm;
height:1.2cm;
}

.bell-label-medium{
width:6cm;
height:1.5cm;
}

.bell-label-large{
width:13.4cm;
height:2cm;
}

.bell-label span{
display:block;
max-width:100%;
font-family:Calibri,Arial,sans-serif;
font-weight:700;
line-height:1.05;
white-space:normal;
overflow-wrap:normal;
word-break:normal;
color:#000;
}

.bell-label-classic span{
font-family:Georgia,serif;
font-size:15px;
}

.bell-label-modern span{
font-family:Calibri,Arial,sans-serif;
font-size:16px;
text-transform:none;
letter-spacing:0;
}

.bell-label-large.bell-label-modern span{
font-size:24px;
}

.bell-label-medium.bell-label-modern span{
font-size:18px;
}

.bell-label-compact span{
font-family:Calibri,Arial,sans-serif;
font-size:13px;
}

.bell-label-weak{
border-color:#cbd5e1;
box-shadow:none;
}

.letter-tool-grid{
grid-template-columns:minmax(360px,.95fr) minmax(360px,1.05fr);
}

.letter-preview{
background:#f8fafc;
border:1px dashed #cbd5e1;
border-radius:8px;
padding:14px;
min-height:420px;
overflow:auto;
}

.letter-preview-page{
position:relative;
width:100%;
max-width:520px;
min-height:690px;
margin:0 auto;
padding:28px 34px;
background:#fff;
border:1px solid #e2e8f0;
box-shadow:0 12px 28px rgba(15,23,42,0.08);
font-size:12px;
line-height:1.45;
color:#111827;
}

.letter-preview-logo{
position:absolute;
top:28px;
right:34px;
width:112px;
height:auto;
object-fit:contain;
}

.letter-preview-fold{
position:absolute;
left:0;
width:18px;
border-top:1px solid #111827;
}

.letter-preview-fold-top{
top:205px;
}

.letter-preview-fold-bottom{
top:454px;
}

.letter-preview-sender{
margin-top:78px;
font-size:9px;
line-height:1.2;
color:#475569;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.letter-preview-recipient{
margin-top:20px;
min-height:82px;
margin-bottom:18px;
}

.letter-preview-date{
text-align:right;
margin-bottom:22px;
}

.letter-preview-body{
margin-top:16px;
}

.letter-preview-body p{
margin:0 0 12px;
}

.letter-preview-audit{
display:grid;
grid-template-columns:minmax(0,1fr) 86px;
gap:12px;
align-items:center;
border:1px solid #cbd5e1;
padding:10px;
margin-top:16px;
font-size:11px;
}

.letter-preview-audit code{
font-size:16px;
font-weight:800;
}

.letter-preview-audit span{
display:block;
color:#64748b;
overflow-wrap:anywhere;
margin-top:4px;
}

.letter-preview-audit svg{
display:block;
width:86px;
height:86px;
}

.qr-tool-grid{
grid-template-columns:minmax(320px,.8fr) minmax(320px,1.2fr);
}

.qr-preview{
display:flex;
align-items:center;
justify-content:center;
min-height:360px;
padding:18px;
background:#f8fafc;
border:1px dashed #cbd5e1;
border-radius:8px;
}

.qr-card{
width:min(100%,320px);
padding:18px;
background:#fff;
border:1px solid #e2e8f0;
border-radius:8px;
box-shadow:0 12px 28px rgba(15,23,42,0.08);
}

.qr-card svg{
display:block;
width:100%;
height:auto;
}

.history-editor-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
margin:14px 0 20px;
}

.history-editor{
border:1px solid #dbe3ef;
border-radius:8px;
padding:14px;
background:#f8fafc;
}

.history-editor-head{
display:flex;
justify-content:space-between;
gap:12px;
align-items:center;
margin-bottom:12px;
}

.history-editor-head span{
color:#64748b;
font-size:13px;
}

.history-add-row{
display:grid;
grid-template-columns:1fr 1fr 1.2fr auto;
gap:10px;
align-items:end;
}

.history-list{
display:grid;
gap:8px;
margin-top:12px;
}

.history-row,
.history-timeline-item{
display:flex;
justify-content:space-between;
gap:12px;
align-items:flex-start;
border:1px solid #dbe3ef;
border-radius:8px;
padding:10px;
background:#fff;
}

.history-row div,
.history-timeline-item{
display:grid;
gap:3px;
}

.history-row span,
.history-row small,
.history-timeline-item span,
.history-timeline-item p{
color:#64748b;
font-size:13px;
margin:0;
}

.history-timeline{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:10px;
margin-bottom:18px;
}

.digital-signature-panel{
border:1px solid #dbe3ef;
border-radius:8px;
padding:14px;
background:#f8fafc;
margin-top:14px;
}

.digital-signature-head{
display:flex;
justify-content:space-between;
gap:12px;
align-items:center;
margin-bottom:10px;
}

.digital-signature-head div{
display:grid;
gap:3px;
}

.digital-signature-head span{
color:#64748b;
font-size:13px;
}

.signature-pad{
display:block;
width:100%;
height:180px;
background:#fff;
border:1px dashed #94a3b8;
border-radius:8px;
touch-action:none;
}

.signature-pad-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
}

.signature-pad-card{
display:grid;
gap:8px;
}

.recipient-signature-list{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:14px;
}

.signature-pad-title{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
}

.protocol-archive-toolbar{
max-width:360px;
margin-bottom:14px;
}

#protocol-archive-pagination{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
margin-top:14px;
flex-wrap:wrap;
}

#protocol-archive-pagination div{
display:flex;
gap:8px;
flex-wrap:wrap;
}

#protocol-archive-pagination span{
color:#64748b;
font-size:13px;
}

.lock-plan-layout{
display:grid;
grid-template-columns:minmax(280px,420px) minmax(0,1fr);
gap:18px;
align-items:start;
}

.compact-actions{
justify-content:flex-start;
margin:8px 0 14px;
}

.lock-plan-graphic{
margin-bottom:14px;
}

.lock-plan-viewbar{
display:grid;
grid-template-columns:1fr;
gap:10px;
align-items:center;
margin-bottom:14px;
}

.lock-plan-axis-note{
display:flex;
flex-wrap:wrap;
gap:10px 16px;
align-items:center;
border:1px solid #dbe3ef;
border-radius:8px;
padding:10px 12px;
background:#f8fafc;
color:#475569;
font-size:13px;
margin-bottom:12px;
}

.lock-plan-axis-note strong{
color:#0f172a;
}

.lock-plan-stats{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
margin-bottom:12px;
}

.lock-plan-stats div{
border:1px solid #dbe3ef;
border-radius:8px;
padding:10px;
background:#fff;
}

.lock-plan-stats span{
display:block;
color:#64748b;
font-size:12px;
margin-bottom:4px;
}

.lock-plan-stats strong{
font-size:20px;
}

.lock-plan-key-strip{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
gap:10px;
margin-bottom:14px;
}

.lock-plan-key-strip article{
border:1px solid #cbd5e1;
border-radius:8px;
padding:12px;
background:linear-gradient(180deg,#fff,#f8fafc);
position:relative;
overflow:hidden;
}

.lock-plan-key-strip article::before{
content:"";
position:absolute;
left:0;
top:0;
bottom:0;
width:var(--access-width,4px);
background:#2563eb;
opacity:.14;
}

.lock-plan-key-strip strong,
.lock-plan-key-strip span{
position:relative;
display:block;
}

.lock-plan-key-strip span{
color:#64748b;
font-size:13px;
margin-top:4px;
}

.lock-plan-door-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:12px;
}

.lock-plan-door-card{
border:1px solid #dbe3ef;
border-radius:8px;
background:#fff;
padding:12px;
display:grid;
gap:12px;
}

.lock-plan-door-head{
display:flex;
justify-content:space-between;
gap:12px;
align-items:flex-start;
}

.lock-plan-door-head div{
display:grid;
gap:3px;
}

.lock-plan-door-head span{
color:#64748b;
font-size:13px;
}

.lock-plan-access-chips{
display:flex;
flex-wrap:wrap;
gap:6px;
align-items:center;
}

.lock-plan-access-chips span{
background:#eff6ff;
border:1px solid #bfdbfe;
border-radius:999px;
color:#1d4ed8;
font-size:12px;
font-weight:700;
padding:5px 8px;
}

.lock-plan-access-chips small{
color:#64748b;
font-size:12px;
}

.lock-plan-matrix-wrap{
overflow:auto;
border:1px solid #dbe3ef;
border-radius:8px;
max-height:70vh;
background:#fff;
}

.lock-plan-matrix{
width:max-content;
min-width:100%;
border-collapse:separate;
border-spacing:0;
font-size:13px;
}

.lock-plan-matrix th{
position:relative;
white-space:normal;
}

.lock-plan-matrix thead th{
position:sticky;
top:0;
z-index:2;
}

.lock-plan-matrix th:first-child{
position:sticky;
left:0;
z-index:3;
background:#f8fafc;
min-width:260px;
max-width:320px;
box-shadow:1px 0 0 #dbe3ef;
text-align:left;
}

.lock-plan-matrix th span{
display:block;
color:#64748b;
font-size:12px;
font-weight:400;
margin-top:2px;
}

.lock-plan-matrix .axis-corner span{
margin:0 0 4px;
text-transform:uppercase;
letter-spacing:.04em;
}

.lock-plan-matrix .key-axis-header{
width:46px;
min-width:46px;
height:150px;
padding:6px 4px;
vertical-align:bottom;
text-align:center;
background:#f8fafc;
}

.lock-plan-matrix .key-axis-header span{
writing-mode:vertical-rl;
transform:rotate(180deg);
display:inline-block;
max-height:122px;
overflow:hidden;
text-overflow:ellipsis;
color:#0f172a;
font-size:12px;
font-weight:700;
line-height:1.1;
margin:0 auto;
}

.lock-plan-matrix tbody th{
padding:9px 30px 9px 10px;
}

.lock-plan-matrix tbody th strong{
display:block;
margin-top:2px;
font-size:13px;
}

.lock-plan-matrix td{
text-align:center;
width:46px;
min-width:46px;
padding:5px;
}

.lock-plan-matrix td button{
width:30px;
height:30px;
padding:0;
border-radius:6px;
border:1px solid #cbd5e1;
background:#fff;
color:#64748b;
font-weight:800;
line-height:1;
}

.lock-plan-matrix td button.active{
background:#0f172a;
border-color:#0f172a;
color:#fff;
}

.mini-remove{
border:0;
background:transparent;
color:#94a3b8;
font-size:18px;
line-height:1;
padding:0 4px;
cursor:pointer;
}

.mini-remove:hover{
color:#ef4444;
}

.mini-edit{
border:0;
background:transparent;
color:#64748b;
font-size:14px;
line-height:1;
padding:0 4px;
cursor:pointer;
}

.mini-edit:hover{
color:#2563eb;
}

.hint-row{
display:flex;
flex-direction:column;
gap:4px;
}

.hint-content{
flex:1;
}

.hint-meta{
display:flex;
justify-content:space-between;
align-items:center;
color:#64748b;
font-size:12px;
}

.hint-meta small{
color:#94a3b8;
}

.delete-button{
background:none;
border:none;
color:#ef4444;
font-size:18px;
cursor:pointer;
padding:0;
line-height:1;
opacity:0.7;
transition:opacity 0.2s;
}

.delete-button:hover{
opacity:1;
}

.toolbar{
display:grid;
grid-template-columns:minmax(260px, 1fr) 220px;
gap:16px;
margin-bottom:18px;
}

.search-field{
position:relative;
}

.search-field span{
position:absolute;
left:14px;
top:50%;
transform:translateY(-50%);
font-size:14px;
color:#64748b;
}

.search-field input{
padding-left:40px;
}

.table-wrap{
overflow-x:auto;
}

.table-link{
appearance:none;
border:0;
background:transparent;
color:#0f172a;
padding:0;
border-radius:0;
font:inherit;
font-weight:600;
text-align:left;
text-decoration:none;
cursor:pointer;
}

.table-link:hover{
color:#334155;
background:#f1f5f9;
border-radius:6px;
}

.sort-header{
appearance:none;
border:0;
background:transparent;
color:#334155;
padding:0;
border-radius:0;
font:inherit;
font-weight:600;
text-align:left;
display:inline-flex;
align-items:center;
gap:6px;
cursor:pointer;
}

.sort-header:hover,
.sort-header.active{
color:#1d4ed8;
}

.sort-header span{
display:inline-block;
min-width:20px;
font-weight:400;
color:#64748b;
}

.tenant-since-duration{
display:inline-block;
font-size:14px;
font-weight:400;
min-width:90px;
}

.data-table th:last-child,
.data-table td:last-child{
width:220px;
}

.muted{
color:#64748b;
}

.resident-list{
display:flex;
flex-wrap:wrap;
gap:6px;
max-width:320px;
}

.resident-chip{
display:inline-flex;
align-items:center;
min-height:28px;
padding:5px 10px;
border-radius:999px;
background:#f1f5f9;
color:#334155;
font-size:13px;
font-weight:600;
line-height:1.2;
}

.file-modal{
width:760px;
}

.file-hero{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:18px;
padding:18px;
background:#eff6ff;
border:1px solid #bfdbfe;
border-left:6px solid #1d4ed8;
border-radius:8px;
margin-bottom:18px;
}

.akte-overview-side{
display:flex;
align-items:center;
gap:14px;
}

.akte-logo{
width:96px;
height:auto;
display:block;
background:white;
border:1px solid #bfdbfe;
border-radius:8px;
padding:8px;
box-shadow:0 8px 20px rgba(30,64,175,.12);
}

.file-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:12px;
margin-bottom:18px;
}

.file-field{
padding:16px;
background:#fff;
border:1px solid #e5e7eb;
border-radius:6px;
min-height:78px;
box-shadow:inset 4px 0 0 #e2e8f0;
}

.file-field span,
.file-note span{
display:block;
color:#64748b;
font-size:13px;
margin-bottom:8px;
}

.file-field strong{
display:block;
font-size:16px;
line-height:1.3;
}

.apartment-key-list{
margin-top:10px;
}

.apartment-key-list table{
background:#fff;
}

.file-note{
padding:16px;
border:1px solid #e2e8f0;
border-radius:6px;
margin-top:12px;
}

.file-note p{
line-height:1.5;
color:#334155;
}

.file-cover{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:18px;
padding:22px;
background:#0f172a;
color:white;
border-radius:8px 8px 2px 2px;
position:relative;
overflow:hidden;
}

.file-cover::after{
content:"";
position:absolute;
right:22px;
bottom:-28px;
width:120px;
height:120px;
border:1px solid rgba(255,255,255,0.18);
border-radius:50%;
}

.file-cover span{
display:block;
font-size:13px;
color:#cbd5e1;
margin-bottom:8px;
}

.file-cover strong{
display:block;
font-size:34px;
line-height:1;
}

.file-icon,
.section-icon{
display:inline-block;
margin-right:8px;
font-size:18px;
vertical-align:middle;
}

.file-stamp{
border:1px solid rgba(255,255,255,0.45);
border-radius:4px;
padding:8px 12px;
font-size:13px;
font-weight:700;
text-transform:uppercase;
letter-spacing:0;
transform:rotate(-2deg);
}

.file-section-heading{
display:inline-flex;
align-items:center;
padding:8px 12px;
background:#dbeafe;
color:#1e40af;
border:1px solid #93c5fd;
border-radius:6px 6px 0 0;
font-size:13px;
font-weight:700;
margin-top:4px;
}

.file-grid-readable{
padding:18px;
background:#eff6ff;
border:1px solid #93c5fd;
border-radius:0 0 8px 8px;
box-shadow:0 12px 30px rgba(15,23,42,0.06);
}

.ledger-note{
background:#fff;
box-shadow:inset 4px 0 0 #60a5fa;
}

.empty-state{
display:none;
padding:26px;
text-align:center;
color:#64748b;
background:#f8fafc;
border:1px dashed #cbd5e1;
border-radius:18px;
margin-top:16px;
}

.database-warning{
position:fixed;
left:0;
right:0;
bottom:0;
z-index:3000;
padding:14px 24px;
background:#7f1d1d;
color:#fff;
font-weight:700;
text-align:center;
box-shadow:0 -10px 30px rgba(15,23,42,.18);
}

@media (max-width:1100px){
.cards,
.apartment-stats{
grid-template-columns:repeat(2,1fr);
}

.key-cockpit-alerts{
grid-template-columns:repeat(2,minmax(150px,1fr));
}

.key-workflow-bar,
.key-cockpit-focus{
grid-template-columns:1fr;
}

.protocol-add-row,
.protocol-signature-grid,
.history-editor-grid,
.lock-plan-layout,
.lock-plan-viewbar,
.signature-pad-grid{
grid-template-columns:1fr;
}

.dashboard-grid,
.quick-grid{
grid-template-columns:1fr;
}

.measure-board{
grid-template-columns:repeat(2,minmax(240px,1fr));
}

.ticket-board{
grid-template-columns:repeat(2,minmax(240px,1fr));
}

.tool-grid{
grid-template-columns:1fr;
}
}

@media (max-width:760px){
body{
display:block;
}

.sidebar{
position:static;
width:100%;
height:auto;
}

.content{
margin-left:0;
padding:24px;
}

.page-head,
.box-header,
.footer-sync{
flex-direction:column;
align-items:flex-start;
}

.page-actions{
width:100%;
justify-content:flex-start;
}

.userbox{
width:100%;
justify-content:space-between;
}

.ticket-alert{
order:3;
width:100%;
justify-content:space-between;
}

.toolbar,
.measure-toolbar,
.ticket-toolbar,
.tool-grid,
.history-add-row,
.key-workflow-bar,
.key-cockpit-focus,
.key-unit-columns,
.key-unit-meta,
.form-grid,
.apartment-stats,
.cards,
.measure-board,
.ticket-board,
.dashboard-stat-grid{
grid-template-columns:1fr;
}

.key-cockpit-alerts{
grid-template-columns:1fr;
}

.key-management-grid,
.settings-layout,
.settings-group-grid,
.settings-inline-form{
grid-template-columns:1fr;
}

.settings-nav-panel{
position:static;
}

.settings-tag-row{
align-items:flex-start;
flex-direction:column;
}

.settings-row-actions{
width:100%;
justify-content:flex-start;
flex-wrap:wrap;
}

.modal{
padding:18px;
}

.modal-content{
width:100%;
}

.ticket-public-body{
padding:16px;
}

.ticket-public-panel{
padding:20px;
}

.ticket-public-brand{
align-items:flex-start;
flex-direction:column;
}

.ticket-public-actions{
align-items:stretch;
flex-direction:column;
}

.ticket-detail-grid{
grid-template-columns:1fr;
}

.key-audit-summary,
.key-holder-summary,
.key-audit-public-row{
grid-template-columns:1fr;
}

.key-audit-public-head{
align-items:stretch;
flex-direction:column;
}

.tool-controls,
.tool-preview{
padding:16px;
}

.tool-actions{
flex-direction:column;
}

.tool-actions button{
width:100%;
}

.bell-label-preview{
padding:12px;
}

.file-grid{
grid-template-columns:1fr;
}

.file-cover{
flex-direction:column;
align-items:flex-start;
}

.file-hero{
flex-direction:column;
}

.akte-overview-side{
align-items:flex-start;
flex-direction:column;
}
}

/* Modern app shell and theme layer */
:root{
--app-bg:#f6f8fb;
--app-bg-end:#eef3f8;
--surface:#ffffff;
--surface-raised:#ffffff;
--surface-soft:#f3f6fa;
--surface-muted:#eaf0f6;
--border:#d9e2ec;
--border-strong:#c4cfdc;
--text:#172033;
--heading:#0c1324;
--muted:#637083;
--muted-strong:#465569;
--primary:#2563eb;
--primary-strong:#1d4ed8;
--primary-soft:#e7efff;
--accent:#0f766e;
--accent-soft:#ddf7f3;
--warning:#b7791f;
--warning-soft:#fff4d6;
--danger:#dc2626;
--danger-soft:#fee8e8;
--success:#15803d;
--success-soft:#e4f8eb;
--sidebar-bg:#102236;
--sidebar-text:#eef4fb;
--sidebar-muted:#94a3b8;
--sidebar-hover:rgba(255,255,255,.08);
--sidebar-active:rgba(255,255,255,.11);
--shadow-soft:0 14px 36px rgba(20,31,47,.08);
--shadow-card:0 1px 2px rgba(20,31,47,.06),0 14px 32px rgba(20,31,47,.06);
--ring:0 0 0 4px rgba(37,99,235,.16);
}

:root[data-theme="dark"]{
--app-bg:#121316;
--app-bg-end:#191714;
--surface:#1b1d22;
--surface-raised:#22242a;
--surface-soft:#24272e;
--surface-muted:#2b2f37;
--border:#343a45;
--border-strong:#4a5260;
--text:#e7edf5;
--heading:#f8fafc;
--muted:#a7b1bf;
--muted-strong:#c2cad5;
--primary:#7aa2ff;
--primary-strong:#9bbaff;
--primary-soft:#25324b;
--accent:#5eead4;
--accent-soft:#173d39;
--warning:#f6c453;
--warning-soft:#493716;
--danger:#f87171;
--danger-soft:#4a2224;
--success:#74d99f;
--success-soft:#1f3a2a;
--sidebar-bg:#101d2b;
--sidebar-text:#f2f6fb;
--sidebar-muted:#9aa6b6;
--sidebar-hover:rgba(255,255,255,.09);
--sidebar-active:#f8fafc;
--shadow-soft:0 18px 50px rgba(0,0,0,.34);
--shadow-card:0 1px 1px rgba(255,255,255,.04),0 18px 40px rgba(0,0,0,.28);
--ring:0 0 0 4px rgba(122,162,255,.18);
}

html{
background:var(--app-bg);
}

body{
background:linear-gradient(180deg,var(--app-bg) 0%,var(--app-bg-end) 100%);
color:var(--text);
font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;
min-height:100vh;
}

a{
color:var(--primary);
}

button,
.button-link{
background:var(--primary);
color:#fff;
border:1px solid transparent;
border-radius:8px;
font-weight:700;
box-shadow:0 8px 18px rgba(37,99,235,.16);
transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease,color .18s ease;
}

button:hover,
.button-link:hover{
background:var(--primary-strong);
box-shadow:0 12px 26px rgba(37,99,235,.22);
transform:translateY(-1px);
}

button:focus-visible,
.button-link:focus-visible,
input:focus,
select:focus,
textarea:focus,
.nav a:focus-visible,
.table-link:focus-visible{
outline:none;
box-shadow:var(--ring);
border-color:var(--primary);
}

.secondary,
.logout-button{
background:var(--surface-muted);
color:var(--text);
border-color:var(--border);
box-shadow:none;
}

.secondary:hover,
.logout-button:hover{
background:var(--surface-soft);
color:var(--heading);
border-color:var(--border-strong);
box-shadow:none;
}

.sidebar{
background:linear-gradient(180deg,#102236 0%,#0b1a2a 100%);
color:var(--sidebar-text);
border-right:1px solid rgba(15,23,42,.18);
box-shadow:18px 0 46px rgba(15,23,42,.12);
padding:0;
gap:0;
}

.logo-img{
width:100%;
max-width:none;
border-radius:0;
padding:22px 34px 26px;
margin:0;
background:#fff;
box-shadow:none;
border-bottom:1px solid var(--border);
}

.nav{
gap:7px;
padding:16px 12px;
}

.nav a{
position:relative;
display:grid;
grid-template-columns:22px minmax(0,1fr);
align-items:center;
column-gap:18px;
min-height:48px;
color:#d8e3ef;
border:1px solid transparent;
border-radius:8px;
font-weight:650;
padding:0 14px;
letter-spacing:0;
}

.nav a:not(:first-child){
column-gap:24px;
}

.nav a::before{
display:none;
}

.nav-icon{
width:22px;
height:22px;
display:inline-flex;
align-items:center;
justify-content:center;
color:#d8e3ef;
line-height:0;
}

.nav-icon svg{
width:21px;
height:21px;
display:block;
fill:none;
stroke:currentColor;
stroke-width:1.9;
stroke-linecap:round;
stroke-linejoin:round;
}

.nav-label{
min-width:0;
line-height:1;
}

.nav a:hover{
background:rgba(255,255,255,.075);
color:#fff;
border-color:rgba(255,255,255,.09);
}

.nav a.active{
background:rgba(255,255,255,.13);
color:#fff;
border-color:rgba(255,255,255,.12);
box-shadow:none;
}

.nav a.active .nav-icon{
color:#fff;
}

.nav a.active::after{
content:"";
position:absolute;
left:0;
top:10px;
bottom:10px;
width:3px;
border-radius:0 999px 999px 0;
background:#60a5fa;
}

.account-panel{
border:0;
border-top:1px solid rgba(255,255,255,.10);
background:rgba(0,0,0,.12);
border-radius:0;
padding:16px;
margin-top:auto;
box-shadow:none;
}

.account-panel span{
color:var(--sidebar-muted);
}

.account-avatar,
.user-avatar{
background:var(--primary-soft);
color:var(--primary-strong);
border:1px solid var(--border);
}

.content{
background:transparent;
}

.topbar{
height:auto;
min-height:72px;
background:rgba(255,255,255,.82);
border-bottom:1px solid var(--border);
box-shadow:0 10px 28px rgba(20,31,47,.06);
backdrop-filter:blur(14px);
flex-wrap:wrap;
}

:root[data-theme="dark"] .topbar{
background:rgba(27,29,34,.84);
}

.topbar-left h2,
.page-title,
.box h3,
.card h2,
.auth-card h1,
.ticket-public-brand h1{
color:var(--heading);
}

h1,
h2,
h3,
h4,
strong{
color:inherit;
}

.hamburger{
width:42px;
height:42px;
display:inline-flex;
align-items:center;
justify-content:center;
border:1px solid var(--border);
border-radius:8px;
background:var(--surface-soft);
color:var(--muted-strong);
font-size:22px;
}

.page-head{
padding:20px 0 4px;
}

.subtitle,
.box-subtitle,
.muted,
.card span,
.userbox .account-role,
.ticket-public-brand p,
.tool-preview-head span,
.hint-meta,
.ticket-modal-meta,
.global-search-result small,
.global-search-empty{
color:var(--muted);
}

.userbox .account-role{
color:var(--muted) !important;
}

.cards,
.apartment-stats,
.dashboard-grid,
.quick-grid,
.ticket-board,
.measure-board{
gap:16px;
}

.card,
.box,
.modal-content,
.auth-card,
.ticket-public-panel,
.ticket-card,
.measure-card,
.tool-controls,
.tool-preview,
.key-inventory-panel,
.protocol-builder,
.qr-card,
.file-field,
.file-note,
.dashboard-stat-grid div,
.today-item,
.global-search-results{
background:var(--surface);
border:1px solid var(--border);
border-radius:8px;
box-shadow:var(--shadow-card);
}

.card{
position:relative;
overflow:hidden;
padding:22px;
}

.card::before{
content:"";
position:absolute;
left:0;
right:0;
top:0;
height:3px;
background:linear-gradient(90deg,var(--primary),var(--accent));
}

.cards .card{
min-height:126px;
}

.cards .badge{
width:52px;
height:52px;
display:inline-flex;
align-items:center;
justify-content:center;
padding:0;
font-size:0;
border-radius:50%;
}

.cards .badge::before{
font-size:24px;
line-height:1;
}

.cards .card:nth-child(1) .badge::before{content:"⌂"}
.cards .card:nth-child(2) .badge::before{content:"!"}
.cards .card:nth-child(3) .badge::before{content:"✓"}
.cards .card:nth-child(4) .badge::before{content:"•"}

.cards .card h2{
font-size:38px;
letter-spacing:0;
}

.box,
.modal-content,
.ticket-public-panel{
padding:22px;
}

.box-header{
border-bottom:1px solid var(--border);
padding-bottom:14px;
margin-bottom:18px;
}

.overview-header{
border-bottom:0;
padding-bottom:0;
}

table{
color:var(--text);
}

th{
color:var(--muted-strong);
border-bottom-color:var(--border);
font-size:13px;
text-transform:none;
}

td{
border-bottom-color:var(--border);
color:var(--text);
}

tbody tr{
transition:background .16s ease;
}

tbody tr:hover{
background:var(--surface-soft);
}

input,
select,
textarea{
background:var(--surface-raised);
border-color:var(--border);
color:var(--text);
border-radius:8px;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

input::placeholder,
textarea::placeholder{
color:var(--muted);
}

input:disabled,
select:disabled,
textarea:disabled{
background:var(--surface-soft);
color:var(--muted-strong);
}

label{
color:var(--muted-strong);
}

.badge,
.status,
.resident-chip,
.ticket-meta span,
.ticket-modal-meta span,
.key-issue-hint span,
.key-audit-answer-list span,
.tool-size-badge{
border-radius:999px;
border:1px solid transparent;
}

.blue{
background:var(--primary-soft);
color:var(--primary-strong);
border-color:rgba(37,99,235,.18);
}

.yellow{
background:var(--warning-soft);
color:var(--warning);
border-color:rgba(183,121,31,.18);
}

.red{
background:var(--danger-soft);
color:var(--danger);
border-color:rgba(220,38,38,.18);
}

.green{
background:var(--success-soft);
color:var(--success);
border-color:rgba(21,128,61,.18);
}

.gray,
.resident-chip,
.ticket-meta span,
.ticket-modal-meta span,
.key-issue-hint span,
.key-audit-answer-list span{
background:var(--surface-soft);
color:var(--muted-strong);
border-color:var(--border);
}

.ticket-alert{
background:var(--danger-soft);
color:var(--danger);
border-color:rgba(220,38,38,.25);
border-radius:8px;
}

.ticket-alert strong{
background:var(--danger);
}

.icon-button{
background:var(--primary-soft);
color:var(--primary-strong);
border-color:rgba(37,99,235,.18);
box-shadow:none;
}

.icon-button.danger,
.delete-button{
background:var(--danger-soft);
color:var(--danger);
}

.icon-button.success{
background:var(--success-soft);
color:var(--success);
border-color:rgba(21,128,61,.18);
box-shadow:none;
}

.table-link,
.sort-header{
color:var(--text);
box-shadow:none;
}

.table-link:hover,
.sort-header:hover,
.sort-header.active{
color:var(--primary-strong);
background:var(--primary-soft);
}

.sort-header span,
.search-field span{
color:var(--muted);
}

.search-field input{
background:var(--surface);
}

.global-search-field{
background:var(--surface);
border-color:var(--border);
box-shadow:var(--shadow-soft);
}

.topbar-search-panel .global-search-field,
.page-head-search-panel .global-search-field{
box-shadow:none;
}

.global-search-results{
background:var(--surface-raised);
}

.global-search-result{
background:var(--surface-soft);
color:var(--text);
border:1px solid transparent;
}

.global-search-result:hover,
.today-item:hover,
.tool-jump-nav a:hover{
background:var(--primary-soft);
border-color:rgba(37,99,235,.25);
color:var(--primary-strong);
}

.global-search-result span,
.today-item span{
color:var(--primary-strong);
}

.today-item,
.ticket-card,
.measure-card,
.measure-row,
.hint-row{
color:var(--text);
}

.dashboard-stat-grid div{
background:var(--surface-soft);
box-shadow:inset 4px 0 0 var(--border-strong);
}

.dashboard-stat-grid div:nth-child(1){
box-shadow:inset 4px 0 0 var(--primary);
}

.dashboard-stat-grid div:nth-child(2){
box-shadow:inset 4px 0 0 var(--accent);
}

.dashboard-stat-grid div:nth-child(3){
box-shadow:inset 4px 0 0 var(--warning);
}

.dashboard-stat-grid div:nth-child(4){
box-shadow:inset 4px 0 0 var(--danger);
}

.dashboard-stat-grid span,
.measure-card-head span:not(.status),
.dashboard-measure-link span,
.measure-meta{
color:var(--muted);
}

.dashboard-measure-link{
color:var(--text);
}

.dashboard-measure-link:hover{
background:var(--surface-soft);
}

.subtabs button{
background:var(--surface-soft);
color:var(--muted-strong);
border-color:var(--border);
box-shadow:none;
}

.subtabs button.active{
background:var(--heading);
color:var(--surface);
}

.measure-list,
.measure-row{
border-color:var(--border);
}

.measure-card{
border-left-color:var(--border-strong);
}

.measure-card.measure-overdue{
background:var(--danger-soft);
border-left-color:var(--danger);
}

.measure-card.measure-focused{
border-color:var(--primary);
border-left-color:var(--primary);
box-shadow:var(--ring),var(--shadow-card);
}

.measure-card p,
.file-note p{
color:var(--muted-strong);
}

.measure-meta > span:not(.status){
background:var(--surface-soft);
border-color:var(--border);
border-radius:6px;
}

.key-balance-off,
.key-audit-row-issue{
background:var(--danger-soft);
}

.key-fully-assigned{
background:var(--warning-soft);
}

.key-audit-summary div,
.key-issue-summary div,
.key-holder-summary div,
.key-management-option,
.settings-list-card,
.settings-tag-row,
.ticket-detail-grid div,
.ticket-description-box,
.key-audit-public-head,
.key-audit-public-row,
.bell-label-preview,
.letter-preview,
.qr-preview,
.tool-controls,
.empty-state{
background:var(--surface-soft);
border-color:var(--border);
border-radius:8px;
}

.key-audit-summary div,
.key-issue-summary div,
.key-holder-summary div{
box-shadow:inset 4px 0 0 var(--primary);
}

.protocol-section-heading{
background:var(--primary-soft);
border-color:rgba(37,99,235,.24);
border-radius:8px 8px 0 0;
}

.protocol-section-heading h4,
.protocol-section-heading p,
.ticket-card h3,
.ticket-description-box p,
.ticket-card p,
.file-field strong{
color:var(--text);
}

.tool-jump-nav{
background:var(--surface-soft);
border-color:var(--border);
border-radius:8px;
}

.tool-jump-nav a{
color:var(--muted-strong);
border-radius:6px;
}

.tool-size-badge{
background:var(--heading);
color:var(--surface);
}

.letter-preview-page,
.bell-label,
.qr-card svg{
background:#fff;
color:#111827;
}

.ticket-public-body,
.auth-body{
background:linear-gradient(180deg,var(--app-bg) 0%,var(--app-bg-end) 100%);
color:var(--text);
}

.auth-card,
.ticket-public-panel{
box-shadow:0 28px 80px rgba(20,31,47,.16);
}

:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .ticket-public-panel{
box-shadow:0 30px 90px rgba(0,0,0,.38);
}

.auth-logo,
.ticket-public-brand img,
.akte-logo{
background:#fff;
border:1px solid var(--border);
border-radius:8px;
}

.auth-tabs{
background:var(--surface-soft);
border:1px solid var(--border);
border-radius:8px;
}

.auth-tab{
color:var(--muted-strong);
box-shadow:none;
}

.auth-tab.active{
background:var(--heading);
color:var(--surface);
}

.ticket-public-brand{
border-bottom-color:var(--border);
}

.ticket-checkline label{
background:var(--surface-soft);
border-color:var(--border);
}

.checkbox-line label{
display:inline-flex;
align-items:center;
gap:10px;
width:auto;
padding:10px 12px;
margin:0;
border:1px solid var(--border);
border-radius:8px;
background:var(--surface-soft);
color:var(--text);
}

.checkbox-line input{
width:auto;
}

.file-hero{
background:var(--primary-soft);
border-color:rgba(37,99,235,.24);
border-left-color:var(--primary);
border-radius:8px;
}

.file-field{
box-shadow:inset 4px 0 0 var(--border);
}

.footer-sync{
background:var(--surface-raised);
color:var(--text);
border:1px solid var(--border);
box-shadow:var(--shadow-card);
border-radius:8px;
}

.file-cover{
background:var(--heading);
color:var(--surface);
border-radius:8px;
}

.footer-sync strong{
color:var(--heading);
}

.footer-sync span{
color:var(--muted-strong);
}

.file-cover span{
color:var(--border);
}

.sync-badge,
.file-section-heading{
background:var(--primary-soft);
color:var(--primary-strong);
border-color:rgba(37,99,235,.24);
}

.file-grid-readable,
.ledger-note{
background:var(--surface-soft);
border-color:var(--border);
box-shadow:var(--shadow-card);
}

.database-warning{
background:var(--danger);
box-shadow:0 -16px 36px rgba(0,0,0,.24);
}

.theme-toggle{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:38px;
padding:7px 10px;
border-radius:8px;
background:var(--surface-soft);
border:1px solid var(--border);
color:var(--text);
box-shadow:none;
font-size:13px;
font-weight:800;
white-space:nowrap;
}

.theme-toggle:hover{
background:var(--surface);
border-color:var(--border-strong);
color:var(--heading);
box-shadow:var(--shadow-soft);
}

.theme-toggle-track{
position:relative;
display:inline-flex;
align-items:center;
width:36px;
height:20px;
border-radius:999px;
background:var(--border-strong);
padding:2px;
transition:background .18s ease;
}

.theme-toggle-knob{
display:block;
width:16px;
height:16px;
border-radius:999px;
background:#fff;
box-shadow:0 2px 6px rgba(0,0,0,.24);
transition:transform .18s ease;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-track{
background:var(--primary);
}

.theme-toggle[aria-pressed="true"] .theme-toggle-knob{
transform:translateX(16px);
}

#topbar-theme-toggle{
flex-shrink:0;
margin-left:auto;
}

.userbox #topbar-theme-toggle{
margin-left:0;
}

#floating-theme-toggle{
position:fixed;
right:22px;
top:22px;
z-index:40;
background:var(--surface);
box-shadow:var(--shadow-soft);
}

.key-alert-card:hover,
.key-mini-row:hover,
.key-task-item:hover{
background:var(--surface-soft);
color:var(--text);
box-shadow:var(--ring),inset 4px 0 0 var(--primary);
}

.key-alert-card.warning:hover,
.key-task-item.warning:hover{
box-shadow:var(--ring),inset 4px 0 0 #d97706;
}

.key-alert-card.danger:hover,
.key-task-item.danger:hover{
box-shadow:var(--ring),inset 4px 0 0 #dc2626;
}

.key-alert-card.ok:hover{
box-shadow:var(--ring),inset 4px 0 0 #16a34a;
}

:root[data-theme="dark"] img.logo-img,
:root[data-theme="dark"] .auth-logo,
:root[data-theme="dark"] .ticket-public-brand img,
:root[data-theme="dark"] .akte-logo{
filter:brightness(.96);
}

@media (max-width:760px){
.topbar{
margin:-24px -24px 24px -24px;
padding:14px 18px;
align-items:flex-start;
gap:14px;
}

.topbar-search-panel,
.page-head-search-panel{
order:3;
width:100%;
max-width:none;
flex-basis:100%;
margin:0;
}

.theme-toggle-label{
display:none;
}

#floating-theme-toggle{
right:16px;
top:16px;
}
}
