@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap";.bottom-nav{padding:.75rem 1rem calc(.9rem + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:20;background:#0c0c0cf5;border-top:1px solid #ffffff12;grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid;position:fixed;bottom:0;left:0;right:0}.nav-item{min-height:44px;color:var(--color-text-secondary);border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;font-size:.88rem;font-weight:600;text-decoration:none;transition:background .12s,color .12s,border-color .12s;display:inline-flex}.nav-item.active{color:var(--color-accent);background:var(--color-accent-muted);border-color:#c9a2274d}@media (width>=900px){.bottom-nav{border:1px solid #ffffff12;border-radius:18px;max-width:360px;margin:0 auto;position:sticky;bottom:1.25rem}}.skip-link{background:var(--color-accent);color:#0c0c0c;z-index:30;border-radius:10px;padding:.5rem .75rem;position:absolute;top:-40px;left:1rem}.skip-link:focus{top:1rem}.app-shell{background:radial-gradient(circle at 100% 0,#c9a2271f,#0000 25%),linear-gradient(#111 0%,#0c0c0c 35% 100%);min-height:100svh;padding:1rem 1rem 6.5rem}.app-header,.subheader{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.app-header{margin-bottom:1rem}.header-brand{align-items:center;gap:.85rem;display:flex}.logo-container{flex-shrink:0}.header-logo{mix-blend-mode:lighten;border-radius:8px;width:auto;height:40px}.logo-monogram{background:var(--color-accent-muted);width:40px;height:40px;color:var(--color-accent);font-family:var(--font-sans);border:1px solid #c9a22740;border-radius:8px;justify-content:center;align-items:center;font-size:1.3rem;font-weight:800;display:flex}.eyebrow,.subheader__label,.subheader__copy,.identity-chip__role{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.08em;margin:0;font-size:.78rem}.header-meta{align-items:center;gap:.75rem;display:flex}.identity-chip{flex-direction:column;align-items:flex-end;gap:.15rem;display:flex}.identity-chip__name{font-size:.92rem;font-weight:600}.logout-btn{min-height:44px;color:var(--color-text-primary);cursor:pointer;background:#151515;border:1px solid #ffffff14;border-radius:14px;padding:.75rem 1rem}.subheader{background:linear-gradient(#1a1a1af5,#151515f5);border:1px solid #ffffff12;border-radius:20px;margin-bottom:1rem;padding:1rem 1.1rem}.subheader h2{margin-top:.2rem;font-size:1.35rem}.main-content,.app-footer{width:min(100%,1200px);margin:0 auto}@media (width<=640px){.app-header,.subheader,.header-meta{flex-direction:column}.header-meta,.identity-chip{align-items:flex-start}}.view-container{flex-direction:column;gap:1rem;display:flex}.panel{background:linear-gradient(180deg, var(--color-surface-2), var(--color-surface));border:1px solid var(--color-border);box-shadow:var(--shadow-soft);border-radius:20px;padding:1rem}.hero-panel{border:1px solid var(--color-border);background:linear-gradient(#1f1f1fe6,#151515fa);border-radius:20px;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.1rem 1.15rem;display:flex}.section-kicker,.section-note,.metric-title,.last-refreshed,.ledger-card-meta,.employee-card__grid span{color:var(--color-text-secondary);letter-spacing:.06em;text-transform:uppercase;font-size:.78rem}.section-heading,.ledger-title-row,.employee-card__header,.ledger-card-header,.refresh-block,.summary-header{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.refresh-block{align-items:center}.last-refreshed{text-align:right;flex-direction:column;gap:.1rem;display:flex}.refresh-label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-tertiary);font-size:.68rem}.refresh-timestamp{font-size:.82rem;font-family:var(--font-mono);color:var(--color-text-secondary)}.last-refreshed.stale{color:var(--color-accent);background:var(--color-accent-muted);border-radius:999px;padding:.4rem .6rem}.period-filter{gap:.5rem;padding-bottom:.25rem;display:flex;overflow-x:auto}.period-chip{border:1px solid var(--color-border);background:var(--color-surface);min-height:44px;color:var(--color-text-secondary);cursor:pointer;border-radius:999px;flex:none;padding:.75rem .95rem;transition:all .12s}.period-chip.active{color:var(--color-accent);background:var(--color-accent-muted);border-color:#c9a2274d}.card-grid{gap:.9rem;display:grid}.metrics-grid,.card-grid.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}.metric-card{min-height:122px;position:relative;overflow:hidden}.metric-card:before{content:"";background:#ffffff26;height:2px;position:absolute;inset:0 0 auto}.metric-card--earned:before{background:#fff3}.metric-card--paid:before{background:var(--color-paid)}.metric-card--balance:before{background:var(--color-accent)}.metric-title{margin-bottom:.65rem;display:block}.metric-value{font-size:clamp(1.45rem,5vw,2rem);line-height:1.1;display:block}.table-panel{overflow:hidden}.ledger-table{border-collapse:collapse;width:100%}.ledger-table th,.ledger-table td{border-bottom:1px solid var(--color-border);text-align:left;padding:.8rem .65rem}.ledger-table th{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.06em;font-size:.75rem;font-weight:600}.clickable-row{cursor:pointer}.clickable-row:hover{background:#ffffff05}.action-btn,.cancel-btn,.refresh-btn,.back-link,.link-btn,.employee-card,.ledger-card,.logout-btn{transition:background .12s,border-color .12s,color .12s,opacity .12s}.action-btn{background:var(--color-accent);color:#0c0c0c;cursor:pointer;border:0;border-radius:16px;width:100%;min-height:48px;padding:.9rem 1.2rem;font-weight:700}.cancel-btn,.refresh-btn,.link-btn{border:1px solid var(--color-border);background:var(--color-surface-3);min-height:44px;color:var(--color-text-primary);cursor:pointer;border-radius:14px;padding:.7rem 1rem;text-decoration:none}.back-link{width:fit-content;color:var(--color-accent);cursor:pointer;background:0 0;border:0;padding:0}.role-badge,.type-badge{letter-spacing:.03em;text-transform:uppercase;border-radius:999px;align-items:center;min-height:24px;padding:.15rem .5rem;font-size:.7rem;font-weight:700;display:inline-flex}.role-badge{color:var(--color-accent);background:var(--color-accent-muted)}.type-badge{color:var(--color-text-primary);background:#ffffff0f}.type-sales{color:var(--color-earned)}.type-salesmanageroverride{color:#9ab9ff}.type-projectmanager{color:#d9a9ff}.type-payment{color:var(--color-danger)}.employee-cards,.ledger-cards{flex-direction:column;gap:.75rem;display:flex}.employee-card,.ledger-card{border:1px solid var(--color-border);background:var(--color-surface-3);width:100%;color:var(--color-text-primary);text-align:left;border-radius:18px;padding:1rem}.employee-card__name,.ledger-card-job{font-size:1rem;font-weight:600}.employee-card__grid,.ledger-card-balance,.detail-grid{gap:.75rem;display:grid}.employee-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1rem}.employee-card__grid strong,.ledger-card-balance strong{margin-top:.2rem;display:block}.ledger-card-balance{border-top:1px solid var(--color-border);grid-template-columns:1fr auto;align-items:center;margin-top:.85rem;padding-top:.85rem}.ledger-card:disabled{opacity:1}.compact-metrics{margin-top:1rem}.metric-mini{background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:16px;padding:.85rem}.metric-mini span{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;font-size:.78rem;display:block}.metric-mini strong{font-size:1.05rem}.ledger-pay-btn{margin-top:1rem}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin:1rem 0}.detail-stat{background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:16px;padding:1rem}.detail-stat span{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.45rem;font-size:.78rem;display:block}.gate-banner{border-radius:14px;margin-bottom:1rem;padding:.85rem 1rem;font-weight:600}.gate-banner.ok{color:var(--color-earned);background:#34a8531f}.gate-banner.blocked{color:var(--color-danger);background:#d930251f}.math-breakdown{border-top:1px solid var(--color-border);margin:1rem 0 0;padding:0;list-style:none}.math-breakdown li{border-bottom:1px solid var(--color-border);justify-content:space-between;gap:1rem;padding:.8rem 0;display:flex}.detail-math{background:var(--color-accent-muted);border:1px solid #c9a22738;border-radius:18px;padding:1rem}.detail-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:1rem;display:grid}.link-btn.disabled{opacity:.4;pointer-events:none}.modal-overlay{z-index:40;background:#000000bf;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal-content{background:linear-gradient(180deg, var(--color-surface-3), var(--color-surface));border:1px solid var(--color-border);width:min(100%,560px);min-height:min(92svh,720px);padding:1.25rem 1rem calc(1rem + env(safe-area-inset-bottom));border-radius:24px 24px 0 0}.modal-topline{justify-content:space-between;align-items:flex-start;margin-bottom:1rem;display:flex}.icon-close{border:1px solid var(--color-border);background:var(--color-surface-2);min-width:44px;min-height:44px;color:var(--color-text-primary);border-radius:999px}.modal-content label{color:var(--color-text-secondary);margin-bottom:1rem;font-size:.9rem;display:block}.modal-content select,.modal-content input{border:1px solid var(--color-border);width:100%;min-height:52px;color:var(--color-text-primary);background:#111;border-radius:16px;margin-top:.35rem;padding:.85rem .95rem;display:block}.payment-balance{background:var(--color-accent-muted);border-radius:16px;justify-content:space-between;align-items:center;margin-bottom:1rem;padding:.9rem 1rem;display:flex}.modal-actions{grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1.25rem;display:grid}.login-screen{place-items:center;min-height:100svh;padding:1rem;display:grid}.login-card{background:linear-gradient(180deg, var(--color-surface-2), var(--color-surface));border:1px solid var(--color-border);border-radius:24px;width:min(100%,420px);padding:1.5rem}.login-header{margin-bottom:1.5rem}.login-subtitle,.login-help{color:var(--color-text-secondary)}.login-help{margin-top:1rem;font-size:.9rem}.login-input,.login-button{border-radius:16px;width:100%;min-height:50px}.login-input{border:1px solid var(--color-border);color:var(--color-text-primary);background:#111;margin-bottom:.85rem;padding:.85rem .95rem}.login-button{background:var(--color-accent);color:#0c0c0c;border:0;font-weight:700}.google-signin-wrapper{flex-direction:column;align-items:center;gap:.75rem;display:flex}.login-error{color:var(--color-danger);margin-top:1rem}.error-card{border-color:#d9302573}.desktop-only{display:table}.mobile-only{display:none}@media (width<=899px){.metrics-grid,.card-grid.three-col,.detail-grid,.detail-actions,.modal-actions{grid-template-columns:1fr}.hero-panel,.section-heading,.ledger-title-row,.refresh-block{flex-direction:column}.desktop-only{display:none}.mobile-only{display:block}}.confirm-details{flex-direction:column;gap:.75rem;padding:1rem 0;display:flex}.confirm-row{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:.6rem 0;display:flex}.confirm-label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem}.confirm-amount{text-align:center;padding:1.25rem 0;font-size:2rem;font-weight:700}.undo-toast{bottom:calc(80px + env(safe-area-inset-bottom));z-index:50;background:var(--color-surface-3);border:1px solid var(--color-border);box-shadow:var(--shadow-soft);border-radius:14px;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.9rem;animation:.18s toast-in;display:flex;position:fixed;left:50%;transform:translate(-50%)}.undo-btn{border:1px solid var(--color-accent);color:var(--color-accent);background:0 0;border-radius:8px;min-height:36px;padding:.35rem .75rem;font-size:.85rem;font-weight:600}.toast-dismiss{min-width:32px;min-height:32px;color:var(--color-text-tertiary);background:0 0;border:none;font-size:1.1rem}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.clickable-row.top-earner{box-shadow:inset 3px 0 0 var(--color-accent)}.clickable-row.top-earner td:first-child{font-weight:700}.clickable-row.top-earner td.balance{font-size:1.05em;font-weight:600}.employee-card.top-earner{border-left:3px solid var(--color-accent)}.employee-card.top-earner .employee-card__name{font-size:1.1rem;font-weight:700}.top-earner-badge{letter-spacing:.04em;text-transform:uppercase;color:var(--color-accent);background:var(--color-accent-muted);vertical-align:middle;border-radius:999px;align-items:center;margin-left:.5rem;padding:.1rem .45rem;font-size:.65rem;font-weight:700;display:inline-flex}.owner-actions{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.action-btn--secondary{background:var(--color-surface-3);color:var(--color-accent);border:1px solid #c9a22740}.view-as-select{border:1px solid var(--color-border);background:var(--color-surface-2);min-height:36px;color:var(--color-text-primary);font-size:.8rem;font-family:var(--font-sans);border-radius:10px;padding:.3rem .5rem}.impersonation-banner{color:var(--color-accent);text-align:center;background:#c9a22726;border-bottom:1px solid #c9a2274d;justify-content:center;align-items:center;gap:.75rem;padding:.5rem 1rem;font-size:.85rem;display:flex}.impersonation-exit{border:1px solid var(--color-accent);color:var(--color-accent);background:0 0;border-radius:8px;min-height:30px;padding:.25rem .6rem;font-size:.8rem;font-weight:600}@media (width>=900px){.panel,.hero-panel{padding:1.25rem}.modal-overlay{align-items:center}.modal-content{border-radius:24px;min-height:auto;padding:1.5rem}}.commission-chart{flex-direction:column;gap:.6rem;display:flex}.chart-bar-row{align-items:center;gap:.75rem;display:flex}.chart-bar-name{color:var(--color-text-primary);white-space:nowrap;text-overflow:ellipsis;flex:0 0 110px;font-size:.85rem;font-weight:500;overflow:hidden}.chart-bar-track{flex:1;align-items:center;gap:.6rem;min-width:0;display:flex}.chart-bar-fill{background:#c9a22759;border-radius:6px;height:28px;transition:width .18s}.chart-bar-fill.chart-bar-fill--top{background:var(--color-accent)}.chart-bar-amount{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--color-text-secondary);flex-shrink:0;font-size:.82rem}@media (width<=640px){.chart-bar-name{flex:0 0 80px;font-size:.78rem}.chart-bar-fill{height:24px}.chart-bar-amount{font-size:.75rem}}:root{--color-background:#0c0c0c;--color-surface:#151515;--color-surface-2:#1a1a1a;--color-surface-3:#1f1f1f;--color-surface-hover:#232323;--color-border:#ffffff12;--color-text-primary:#e6e6e6;--color-text-secondary:#777;--color-text-tertiary:#555;--color-accent:#c9a227;--color-accent-muted:#c9a2271f;--color-earned:#e6e6e6;--color-paid:#34a853;--color-danger:#d93025;--color-balance:#c9a227;--shadow-soft:0 10px 30px #0000003d;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, monospace}*,:before,:after{box-sizing:border-box}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-sans);background:var(--color-background);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}body,button,input,select,textarea{font:inherit}button,input,select,textarea{font-family:var(--font-sans)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}#root{min-height:100svh}h1,h2,h3,p{margin:0}img{max-width:100%;display:block}a{color:inherit}.financial-amount{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.earned{color:var(--color-earned)}.paid{color:var(--color-paid)}.balance{color:var(--color-balance)}.danger{color:var(--color-danger)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:#ffffff14;border-radius:999px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
