body.kh-exports{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,sans-serif}
.kh-exports *{box-sizing:border-box}
.kh-exports header,.kh-exports main{max-width:1200px;margin:auto;padding:24px}
.kh-exports header{display:flex;justify-content:space-between;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:var(--surface)}
.kh-exports h1{margin:0;font-size:2rem}.kh-exports h2{font-size:1.35rem}.kh-exports h3{margin:0;font-size:1.15rem}.kh-exports .eyebrow{margin:0;color:var(--mut)}
.kh-exports a{color:var(--primary)}
.kh-exports label{display:flex;flex-direction:column;gap:6px;font-weight:600;min-width:0}
.kh-exports button,.kh-exports select,.kh-exports input{font:inherit;min-height:48px;max-width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink)}
.kh-exports button{cursor:pointer;font-weight:650}.kh-exports button:disabled{opacity:.6;cursor:default}
.kh-exports :focus-visible{outline:3px solid var(--primary);outline-offset:3px}
.kh-exports .skip{position:absolute;left:12px;top:-100px;background:var(--surface);padding:12px;z-index:20}.kh-exports .skip:focus{top:12px}
.kh-exports .auth,.kh-exports #filters{margin:24px 0;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.kh-exports .auth h2{margin-top:0}.kh-exports #manager-token{width:min(100%,36rem)}
.kh-exports #filters{display:flex;flex-wrap:wrap;align-items:end;gap:16px}.kh-exports #filters label{flex:1 1 180px}.kh-exports #date-help{flex-basis:100%;margin:0}
.kh-exports #preview{background:var(--primary);color:var(--kh-on-primary);border-color:var(--primary)}
.kh-exports .notice{padding:16px;background:var(--panel);border-left:4px solid var(--primary);border-radius:6px}
.kh-exports .error{color:var(--error);font-weight:600}.kh-exports #status{min-height:1.5em}
.kh-exports .export-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:20px;margin:16px 0 24px}
.kh-exports .export-card{display:flex;flex-direction:column;align-items:start;gap:12px;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface);min-width:0;overflow-wrap:anywhere}
.kh-exports .export-card p{margin:0}.kh-exports .export-count{font-weight:700}.kh-exports .export-card button{margin-top:auto;width:100%}
@media(max-width:40rem){.kh-exports header,.kh-exports main{padding:16px}.kh-exports header{align-items:start}.kh-exports h1{font-size:1.6rem}.kh-exports .auth,.kh-exports #filters{padding:16px}.kh-exports #filters label{flex-basis:100%}.kh-exports #preview{width:100%}}

.kh-exports .payroll-options{margin:24px 0;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.kh-exports .payroll-options h2,.kh-exports .payroll-options p{grid-column:1/-1;margin:0}
.kh-exports #range-summary{font-weight:700;overflow-wrap:anywhere}
@media(max-width:40rem){.kh-exports .payroll-options{grid-template-columns:minmax(0,1fr);padding:16px}.kh-exports header{flex-wrap:wrap;gap:12px}}
