/* KATIQ UX final: light/dark/mobile */
:root{--kq-graphite:#34373b;--kq-graphite-2:#40444a;--kq-border:rgba(20,24,30,.10);--kq-shadow:0 18px 50px rgba(20,24,30,.14);--kq-radius:16px}
[data-theme="dark"],body.dark,body.theme-dark{--kq-bg:#34373b;--kq-surface:#3e4247;--kq-surface-2:#474b50;--kq-text:#f4f6f8;--kq-muted:#b9bec5;--kq-border:rgba(255,255,255,.10);--kq-shadow:0 20px 55px rgba(0,0,0,.38)}
[data-theme="light"],body.light,body.theme-light{--kq-bg:#f4f5f7;--kq-surface:#fff;--kq-surface-2:#f8f9fa;--kq-text:#20242a;--kq-muted:#6c727b}
body{background:var(--kq-bg,var(--bg,#f4f5f7));color:var(--kq-text,var(--text,#20242a))}
.kpi-card,.metric-card{min-width:0;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.kpi-card:hover,.metric-card:hover{transform:translateY(-1px)}
.modal-overlay,.modal-backdrop,.kq-modal-backdrop{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.kq-modal,.modal,.kpi-detail-modal,.salary-expense-modal,.product-analytics-modal,.kq-account-modal,.kq-password-modal{border-radius:var(--kq-radius);box-shadow:var(--kq-shadow);max-width:min(720px,calc(100vw - 32px))}.product-analytics-modal{max-width:min(960px,calc(100vw - 32px))}
.period-picker,.custom-period,.period-control{min-width:0}
@media (max-width:700px){.kpi-grid,.kpi-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kpi-card,.metric-card{min-width:0}.kpi-card .kpi-value,.metric-card .metric-value{font-size:clamp(18px,5.5vw,25px)}.period-picker,.custom-period,.period-control{width:100%}.modal-overlay,.modal-backdrop,.kq-modal-backdrop{padding:12px}.kq-modal,.modal,.kpi-detail-modal,.salary-expense-modal,.product-analytics-modal,.kq-account-modal,.kq-password-modal{width:100%;max-width:100%;max-height:calc(100dvh - 24px);overflow:auto}.modal-header,.modal-footer{gap:8px;flex-wrap:wrap}.modal-footer button{flex:1 1 140px}}
@media (max-width:380px){.kpi-grid,.kpi-row{grid-template-columns:1fr}.kpi-card,.metric-card{padding:12px}}