.att-app{--att-bg:#fff;--att-soft:#f5f7fa;--att-text:#182333;--att-muted:#566579;--att-line:#dde4ed;--att-accent:#245bb1;--att-xs:.75rem;--att-sm:.875rem;--att-base:1rem;--att-title:clamp(1.25rem,1.1rem + .6vw,1.5rem);--att-s1:.25rem;--att-s2:.5rem;--att-s3:.75rem;--att-s4:1rem;--att-s5:1.25rem;--att-s6:1.5rem;color:var(--att-text);font-family:Inter,'Plus Jakarta Sans',sans-serif;font-size:var(--att-sm);line-height:1.6;width:100%;max-width:1600px;margin:auto;padding:var(--att-s6);box-sizing:border-box}
.dark .att-app,[data-theme=dark] .att-app,html.sv-dark .att-app{--att-bg:#172332;--att-soft:#1c2b3e;--att-text:#e5edf7;--att-muted:#adbdd0;--att-line:#34475d;--att-accent:#94baff}
.att-app *{box-sizing:border-box}.att-app h1,.att-app h2,.att-app h3,.att-app p{margin:0}.att-app h1{font-size:var(--att-title);font-weight:700;letter-spacing:-.025em}.att-app h2{font-size:var(--att-base);font-weight:650}.att-app h3{font-size:var(--att-sm);font-weight:650}.att-app p{color:var(--att-muted);margin-top:var(--att-s2);max-width:78ch}.att-heading,.att-toolbar,.att-context,.att-actions,.att-section-heading,.att-section-footer,.att-shift-title,.att-breakdown,.att-eligibility{display:flex;align-items:center;justify-content:space-between;gap:var(--att-s3)}.att-heading{margin-bottom:var(--att-s6);align-items:flex-start}.att-eyebrow{font-size:var(--att-xs);font-weight:700;letter-spacing:.1em;color:var(--att-muted)}.att-actions{justify-content:flex-start;flex-wrap:wrap}.att-button{border:1px solid var(--att-line);border-radius:6px;background:var(--att-bg);color:var(--att-text);font:inherit;font-weight:550;min-height:44px;padding:var(--att-s2) var(--att-s4);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s}.att-button:hover:not(:disabled){background:var(--att-soft);border-color:var(--att-accent)}.att-button:disabled{opacity:.5;cursor:not-allowed}.att-primary{background:var(--att-accent);border-color:var(--att-accent);color:var(--att-bg)}.att-primary:hover:not(:disabled){background:color-mix(in srgb,var(--att-accent) 90%,#000);color:var(--att-bg)}.att-app :focus-visible{outline:2px solid var(--att-accent);outline-offset:3px}.att-tabs{display:flex;gap:var(--att-s1);padding:var(--att-s1);background:var(--att-soft);border-radius:8px}.att-tabs .att-button{background:transparent;border-color:transparent}.att-tabs [aria-pressed=true]{background:var(--att-bg);border-color:var(--att-line)}.att-date{display:flex;gap:var(--att-s2);align-items:center}.att-date input{width:auto}.att-app input,.att-app select,.att-app textarea{font:inherit;color:var(--att-text);background:var(--att-bg);border:1px solid var(--att-line);border-radius:6px;min-height:44px;padding:var(--att-s2) var(--att-s3);max-width:100%;width:100%}.att-context{justify-content:flex-start;flex-wrap:wrap;font-size:var(--att-xs);color:var(--att-muted);padding:var(--att-s3) 0 var(--att-s5)}.att-context strong{color:var(--att-text);font-size:var(--att-sm)}.att-context span+span{padding-left:var(--att-s3);border-left:1px solid var(--att-line)}.att-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border:1px solid var(--att-line);border-radius:10px;background:var(--att-bg);overflow:hidden}.att-metrics article{padding:var(--att-s4);display:flex;flex-direction:column;gap:var(--att-s1);border-right:1px solid var(--att-line)}.att-metrics article:last-child{border:0}.att-metrics span{font-size:var(--att-xs);color:var(--att-muted)}.att-metrics strong{font-size:var(--att-title);font-weight:650;font-variant-numeric:tabular-nums}.att-metrics small,.att-app small{font-size:var(--att-xs);color:var(--att-muted);line-height:1.5}.att-breakdown{justify-content:flex-start;flex-wrap:wrap;font-size:var(--att-xs);color:var(--att-muted);padding:var(--att-s3) var(--att-s1);gap:var(--att-s5);margin-bottom:var(--att-s3)}.att-breakdown b{color:var(--att-text);margin-left:var(--att-s1)}.att-card{border:1px solid var(--att-line);border-radius:10px;background:var(--att-bg);margin-bottom:var(--att-s5);box-shadow:0 1px 2px #10213a05}.att-section-heading{padding:var(--att-s5) var(--att-s6);border-bottom:1px solid var(--att-line)}.att-section-heading p{font-size:var(--att-xs);margin-top:var(--att-s1)}.att-section-footer{padding:var(--att-s4) var(--att-s6);border-top:1px solid var(--att-line);color:var(--att-muted);font-size:var(--att-xs)}.att-eligibility{padding:var(--att-s5) var(--att-s6)}.att-eligibility p{margin-top:var(--att-s1);margin-bottom:var(--att-s2)}.att-shifts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--att-s4);padding:var(--att-s6)}.att-shift{background:var(--att-soft);border-radius:8px;padding:var(--att-s5);border:1px solid var(--att-line)}.att-shift dl{margin:var(--att-s4) 0;display:grid;grid-template-columns:1fr 1fr;gap:var(--att-s4)}.att-shift dt{font-size:var(--att-xs);color:var(--att-muted)}.att-shift dd{margin:var(--att-s1) 0 0;font-variant-numeric:tabular-nums;font-weight:600}.att-shift .att-button{margin-top:var(--att-s4);min-width:170px}.att-note{padding:0 var(--att-s6) var(--att-s4);font-size:var(--att-xs)}.att-chip{display:inline-flex;align-items:center;width:fit-content;gap:var(--att-s1);font-size:var(--att-xs);font-weight:600;line-height:1.5;white-space:nowrap;padding:var(--att-s1) var(--att-s2);border-radius:5px;background:var(--att-soft);color:var(--att-muted);border:1px solid var(--att-line)}.att-full,.att-full_day,.att-eligible{background:#e9f6ee;color:#205b3c;border-color:#c6e6d1}.att-late,.att-partial,.att-partial_day,.att-half,.att-half_day{background:#fff5df;color:#795011;border-color:#eedcab}.att-absent,.att-verification_error{background:#fff0ef;color:#973832;border-color:#f0cbc8}.att-leave,.att-holiday{background:#edf2ff;color:#325893;border-color:#d0dcf4}.att-non_working,.att-account_ineligible{background:#eef0f3;color:#515d6d;border-color:#d7dde5}.att-filters{display:grid;grid-template-columns:2fr 1.3fr 1.3fr 1fr;gap:var(--att-s3);padding:var(--att-s4) var(--att-s6)}.att-app label{font-size:var(--att-xs);font-weight:550;display:flex;flex-direction:column;gap:var(--att-s2)}.att-table-wrap{width:100%;overflow:auto}.att-table{border-collapse:collapse;width:100%;text-align:left}.att-table th{font-size:var(--att-xs);font-weight:600;color:var(--att-muted);background:var(--att-soft);padding:var(--att-s3) var(--att-s4);border-block:1px solid var(--att-line)}.att-table td{padding:var(--att-s4);vertical-align:top;border-bottom:1px solid var(--att-line);font-size:var(--att-sm);max-width:280px}.att-table td:first-child{padding-left:var(--att-s6)}.att-table td:last-child{padding-right:var(--att-s6);white-space:nowrap}.att-table td:last-child .att-button{padding-inline:var(--att-s3);margin:0 var(--att-s1) var(--att-s1) 0}.att-table td small{display:block;margin-top:var(--att-s2);max-width:36ch}.att-id{font-family:ui-monospace,monospace;overflow-wrap:anywhere;font-size:var(--att-xs)!important}.att-muted,.att-footnote{color:var(--att-muted);font-size:var(--att-xs)}.att-footnote{padding:var(--att-s2) 0}.att-empty{text-align:center;padding:var(--att-s6);background:var(--att-bg);border-radius:10px}.att-empty p{margin:var(--att-s2) auto var(--att-s4)}.att-feedback{display:flex;align-items:center;flex-wrap:wrap;gap:var(--att-s3);padding:var(--att-s4);border:1px solid var(--att-line);border-radius:8px;background:var(--att-soft);margin-bottom:var(--att-s4)}.att-error{color:#973832!important;background:#fff0ef;border-color:#f0cbc8}.att-history{display:flex;flex-wrap:wrap;gap:var(--att-s3);padding:var(--att-s5) var(--att-s6)}.att-history .att-button{display:flex;align-items:center;gap:var(--att-s3)}.att-skeleton{display:grid;gap:var(--att-s4)}.att-skeleton div{background:var(--att-soft);border-radius:8px;min-height:100px;animation:att-pulse 1.2s ease-in-out infinite alternate}.att-dialog{--att-bg:#fff;--att-soft:#f5f7fa;--att-text:#182333;--att-muted:#566579;--att-line:#dde4ed;--att-accent:#245bb1;--att-xs:.75rem;--att-sm:.875rem;--att-base:1rem;--att-s1:.25rem;--att-s2:.5rem;--att-s3:.75rem;--att-s4:1rem;--att-s5:1.25rem;--att-s6:1.5rem;font:inherit;color:var(--att-text);border:1px solid var(--att-line);border-radius:12px;width:min(840px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;background:var(--att-bg);margin:auto;box-shadow:0 24px 80px #12213c33}.att-dialog::backdrop{background:#0f1e38aa}.att-dialog>header{display:flex;justify-content:space-between;align-items:center;padding:var(--att-s4) var(--att-s6);border-bottom:1px solid var(--att-line);position:sticky;top:0;background:var(--att-bg);z-index:1}.att-dialog-body{padding:var(--att-s6);display:grid;gap:var(--att-s4)}.att-dialog-body .att-shifts{padding:0}.att-dialog-body p{margin:0}.att-dialog fieldset{border:1px solid var(--att-line);border-radius:8px;padding:var(--att-s4);margin:0}.att-dialog legend{font-weight:650;font-size:var(--att-sm);padding:0 var(--att-s2)}.att-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--att-s4)}.att-dialog textarea{min-height:100px;resize:vertical}.att-dialog [aria-invalid=true]{border-color:#b6453c}.att-dialog label small{color:#973832}.att-check{flex-direction:row!important;align-items:center;gap:var(--att-s2)!important;margin-top:var(--att-s3)}.att-check input{width:20px!important;min-height:20px!important;flex:none}.att-check-grid{display:flex;flex-wrap:wrap;gap:var(--att-s4)}.att-audit{margin-top:var(--att-s4)}.att-audit summary{cursor:pointer;min-height:44px;padding:var(--att-s2) 0}.att-audit p{font-size:var(--att-xs);padding-bottom:var(--att-s2);overflow-wrap:anywhere}.att-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@keyframes att-pulse{to{opacity:.55}}@media(prefers-reduced-motion:reduce){.att-app *{animation:none!important;transition:none!important}}
.dark .att-dialog,[data-theme=dark] .att-dialog,html.sv-dark .att-dialog,html[data-sv-theme=dark] .att-dialog,html[data-sv-theme=dark] .att-app{--att-bg:#172332;--att-soft:#1c2b3e;--att-text:#e5edf7;--att-muted:#adbdd0;--att-line:#34475d;--att-accent:#94baff}
.att-dialog .att-note{padding:var(--att-s3) 0 0}.att-dialog input,.att-dialog select,.att-dialog textarea{color-scheme:light dark}
@media(max-width:1100px){.att-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.att-metrics article:nth-child(3){border-right:0}.att-metrics article:nth-child(-n+3){border-bottom:1px solid var(--att-line)}.att-toolbar{align-items:flex-start;flex-wrap:wrap}.att-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.att-app{padding:var(--att-s3)}.att-heading{flex-direction:column;gap:var(--att-s4)}.att-actions{width:100%}.att-toolbar{gap:var(--att-s4)}.att-tabs{width:100%}.att-tabs .att-button{flex:1}.att-date{width:100%;gap:var(--att-s1)}.att-date input{flex:1;width:0;min-width:0}.att-date .att-button{padding-inline:var(--att-s3)}.att-context{gap:var(--att-s2)}.att-context span+span{padding-left:0;border:0}.att-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.att-metrics article{padding:var(--att-s3);border-bottom:1px solid var(--att-line)}.att-metrics article:nth-child(3){border-right:1px solid var(--att-line)}.att-metrics article:nth-child(even){border-right:0}.att-metrics article:nth-child(n+5){border-bottom:0}.att-breakdown{gap:var(--att-s3)}.att-section-heading,.att-section-footer,.att-eligibility{padding:var(--att-s4);flex-wrap:wrap}.att-shifts{grid-template-columns:1fr;padding:var(--att-s4)}.att-shift{padding:var(--att-s4)}.att-shift .att-button{width:100%}.att-filters{padding:var(--att-s4);gap:var(--att-s3)}.att-table thead{display:none}.att-table,.att-table tbody{display:block}.att-table tr{display:block;margin:var(--att-s3);border:1px solid var(--att-line);border-radius:8px;overflow:hidden}.att-table td{display:block;max-width:none;padding:var(--att-s3) var(--att-s4)!important;border-bottom:1px solid var(--att-line)}.att-table td:before{content:attr(data-label);display:block;color:var(--att-muted);font-size:var(--att-xs);margin-bottom:var(--att-s1)}.att-table td:last-child{border-bottom:0}.att-table td small{max-width:none}.att-section-footer .att-actions{width:auto}.att-dialog-body{padding:var(--att-s4)}.att-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.att-dialog>header{padding:var(--att-s4)}.att-history{padding:var(--att-s4)}}
