.role-dashboard-shell { display: grid; gap: 16px; }
.role-dashboard-head { display: flex; align-items: stretch; justify-content: space-between; gap: 20px; padding: 24px; border: 1px solid rgba(15,118,110,.22); border-radius: 14px; background: linear-gradient(135deg, rgba(15,118,110,.13), rgba(37,99,235,.06)), var(--surface); box-shadow: var(--shadow); }
.role-dashboard-head h1 { margin: 5px 0 7px; font-size: clamp(24px,3vw,34px); line-height: 1.2; }
.role-dashboard-head p { max-width: 760px; margin: 0; color: var(--muted); line-height: 1.7; }
.role-identity-card { min-width: 220px; padding: 16px 18px; display: grid; align-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.78); }
.role-identity-card span, .role-identity-card small { color: var(--muted); }
.role-identity-card strong { font-size: 18px; }
.role-boundary-notice { padding: 11px 14px; border: 1px solid #b9d7d3; border-left: 4px solid var(--primary); border-radius: 9px; background: #edf9f7; color: #265f59; line-height: 1.6; }
.role-metric-grid, .customer-queue-grid, .field-queue-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.customer-queue-grid { grid-template-columns: repeat(4,minmax(0,1fr)); margin: 14px 0 16px; }
.field-queue-grid { grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 14px; }
.role-metric { min-width: 0; min-height: 126px; padding: 15px; display: grid; align-content: space-between; gap: 7px; border: 1px solid var(--line); border-top: 4px solid var(--blue); border-radius: 11px; background: var(--surface); box-shadow: var(--shadow); }
.role-metric.warning { border-top-color: var(--warning); }
.role-metric.danger { border-top-color: var(--danger); }
.role-metric.success { border-top-color: var(--success); }
.role-metric span, .role-metric small { color: var(--muted); }
.role-metric strong { font-size: 28px; line-height: 1; }
.role-metric small { line-height: 1.45; }
.role-dashboard-block { padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
.role-dashboard-block-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.role-dashboard-block h2 { margin: 0; font-size: 17px; }
.role-dashboard-block p { margin: 5px 0 0; color: var(--muted); }
.role-action-grid, .role-module-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.role-quick-action { min-height: 86px; padding: 14px; display: grid; gap: 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); color: var(--text); text-align: left; cursor: pointer; }
.role-quick-action:hover { border-color: var(--primary); background: #edf9f7; transform: translateY(-1px); }
.role-quick-action span, .role-module-state span { color: var(--muted); line-height: 1.45; }
.role-module-state { min-height: 74px; padding: 13px; display: grid; align-content: center; gap: 6px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); }
.field-operating-note { margin-bottom: 14px; padding: 12px 14px; border-radius: 9px; background: #eff6ff; color: #1e4f91; line-height: 1.6; }
.property-fee-subsection { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.property-fee-subsection h4 { margin: 0 0 9px; color: var(--text); font-size: 14px; }
.parking-fee-list { display: grid; gap: 9px; }
.parking-fee-card { padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.parking-fee-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.parking-fee-card-head strong { color: var(--text); }
.parking-fee-card .property-fee-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.property-fee-footnote { margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.55; }
@media (max-width:1180px) { .role-metric-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } .role-action-grid, .role-module-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:860px) { .role-dashboard-head { flex-direction: column; } .role-identity-card { min-width: 0; } .customer-queue-grid, .field-queue-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .role-dashboard-head { padding: 18px; } .role-metric-grid, .customer-queue-grid, .field-queue-grid, .role-action-grid, .role-module-grid, .parking-fee-card .property-fee-grid { grid-template-columns: 1fr; } .role-metric { min-height: 104px; } .role-quick-action { min-height: 76px; } }