:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#17201b;background:#f5f8f5;font-synthesis:none}
*{box-sizing:border-box}html,body{min-height:100%;min-height:100dvh}body{margin:0;background:#f5f8f5}button,select{font:inherit}#worker-app{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
.worker-card{position:relative;width:min(100%,440px);display:grid;align-content:start;grid-auto-rows:max-content;gap:16px;padding:28px;border:1px solid #dbe4dc;border-radius:18px;background:#fff;box-shadow:0 12px 36px rgba(34,60,43,.08)}
.worker-header,.home-topbar,.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand,.business-name{margin:0;color:#496153;font-size:.88rem;font-weight:750;letter-spacing:.035em}.business-name{overflow-wrap:anywhere}.home-content{display:grid;align-content:start;grid-auto-rows:max-content;gap:24px}
h1{margin:0;font-size:clamp(1.5rem,7vw,1.75rem);line-height:1.15;overflow-wrap:anywhere}h2{margin:0;font-size:1.25rem}p{margin:0;line-height:1.5}.worker-name{font-weight:760}.language-control{display:grid;gap:6px;color:#526259;font-size:.9rem}.language-select{width:100%;min-height:46px;border:1px solid #aebcaf;border-radius:10px;background:#fff;padding:8px 32px 8px 12px;color:#17201b}
button{min-height:52px;border-radius:11px;border:1px solid transparent;padding:12px 18px;font-weight:700;cursor:pointer;color:#17201b;background:#fff}button.primary{color:#fff;background:#1e6841}button.secondary{color:#174c32;background:#f4faf6;border-color:#83aa91}button.danger{color:#fff;background:#96352f}button:disabled{cursor:not-allowed;opacity:.52}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #e7ad3e;outline-offset:3px}.icon-button{display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border-color:#ccd7ce;border-radius:10px;background:#fff;font-size:1.4rem;line-height:1}.menu-button{font-size:1.55rem;padding-bottom:8px}
.status{min-height:24px;color:#46574c}.status:empty{min-height:0}.status.error{color:#922f2b}.attendance-panel{display:grid;align-content:start;grid-auto-rows:max-content;gap:14px;padding-top:20px;border-top:1px solid #e2e9e3}.attendance-state{font-size:clamp(1.3rem,6vw,1.5rem);line-height:1.25}.attendance-actions,.checkout-confirmation,.confirmation-actions{display:grid;gap:10px}.checkout-confirmation{padding:14px;border:1px solid #d7b16a;border-radius:12px;background:#fffaf0}.inline-help{justify-self:start;min-height:44px;padding:8px 0;color:#174c32;text-decoration:underline;background:transparent}.security-note{padding-top:16px;border-top:1px solid #e3e9e4;color:#5b6a60;font-size:.88rem}
.install-area{display:grid;gap:10px}.install-panel{display:grid;gap:10px;padding:14px;border:1px solid #d7e0d8;border-radius:12px;background:#f8faf8}.install-panel[hidden]{display:none}.install-help{width:100%;min-height:48px}.install-note,.help-note{font-size:.9rem;color:#526259}.iphone-note{padding-left:12px;border-left:3px solid #83aa91}
.modal-backdrop{position:fixed;z-index:10;inset:0;display:grid;align-items:end;justify-items:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:rgba(20,31,24,.42);overflow:auto}.account-dialog{width:min(100%,430px);max-height:calc(100dvh - max(32px,env(safe-area-inset-top)) - max(32px,env(safe-area-inset-bottom)));overflow:auto;display:grid;gap:16px;padding:20px;border:1px solid #d4ddd5;border-radius:18px;background:#fff;box-shadow:0 18px 50px rgba(20,31,24,.2)}.dialog-header h2{font-size:1.3rem}.dialog-close{font-size:1.7rem}.menu-action{width:100%;text-align:left;border-color:#d2ddd4;background:#fff}.menu-logout{margin-top:4px;padding-top:16px;border-top:1px solid #e2e9e3}.logout-action,.logout-confirm{width:100%;color:#812d29;border-color:#cba6a3;background:#fff}.confirmation-actions{grid-template-columns:1fr 1fr}.support-details summary{min-height:44px;display:flex;align-items:center;font-weight:700;cursor:pointer}.support-detail-body{display:grid;gap:10px}.support-detail-text{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;user-select:text;-webkit-user-select:text;padding:12px;border-radius:8px;background:#17201b;color:#fff;font-size:.78rem}.copy-status{min-height:1.4em;color:#3f5046;font-size:.85rem}
@media (min-width:481px){.modal-backdrop{align-items:center}.account-dialog{border-radius:16px}}
@media (max-width:480px){#worker-app{place-items:stretch;padding:0}.worker-card{min-height:100vh;min-height:100dvh;width:100%;border:0;border-radius:0;padding:calc(20px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));box-shadow:none}.authenticated-home{padding-top:calc(12px + env(safe-area-inset-top))}.home-content{gap:20px}.attendance-panel{gap:12px}.modal-backdrop{padding-left:0;padding-right:0;padding-bottom:0}.account-dialog{width:100%;max-height:calc(100dvh - max(48px,env(safe-area-inset-top)));padding:20px max(16px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border-radius:18px 18px 0 0}.confirmation-actions{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){button{transition:transform .15s ease,filter .15s ease}button:not(:disabled):active{transform:translateY(1px)}}
input.invite-code{width:100%;min-height:58px;border:1px solid #aebcaf;border-radius:11px;padding:10px 14px;font:700 1.55rem/1 ui-monospace,SFMono-Regular,monospace;text-align:center;letter-spacing:.12em;color:#17201b;background:#fff}
input.invite-code:focus-visible{outline:3px solid #e7ad3e;outline-offset:3px}.account-confirm{padding:14px;border-radius:11px;background:#f1f7f3;font-weight:700}
.install-steps{display:grid;gap:8px;margin:0;padding-left:24px;color:#33483b}.install-steps li{padding-left:4px;line-height:1.4}
.balance-label{margin-bottom:-10px;color:#496153;font-weight:700}.balance-amount{font-size:2.25rem;overflow-wrap:anywhere}

/* Authenticated employee workspace */
.authenticated-home{background:#f9fafb;color:#111827;border-color:#e5e7eb;box-shadow:none}
.authenticated-content{display:grid;gap:20px}.home-topbar{min-height:48px}.worker-name{font-size:1.55rem;color:#111827}
.attendance-panel,.balance-screen{display:grid;align-content:start;gap:16px;padding:20px;border:1px solid #e5e7eb;border-radius:16px;background:#fff}
.attendance-panel{border-top:1px solid #e5e7eb}.attendance-state{color:#111827}.state-working,.state-on_break{color:#166534}
.authenticated-home button.primary{background:#16a34a}.authenticated-home button.secondary{color:#166534;background:#fff;border-color:#bbd7c4}
.beta-navigation{position:sticky;bottom:0;z-index:5;display:flex;align-items:stretch;justify-content:space-around;margin:8px -28px -28px;padding:4px 12px calc(4px + env(safe-area-inset-bottom));border-top:1px solid #e5e7eb;background:#fff}
.beta-nav-item{flex:1;min-width:64px;min-height:52px;display:grid;place-content:center;gap:2px;padding:5px 8px;border:0;border-radius:8px;color:#6b7280;background:transparent;font-size:.75rem}.beta-nav-item.active{color:#16a34a}.beta-nav-icon{font-size:1.25rem;line-height:1}
.balance-screen{min-height:360px}.balance-screen .balance-amount{order:1;margin-top:20px;font-size:2.4rem}.balance-screen .balance-label{order:2;margin:0;color:#6b7280}.balance-screen p:not(.balance-label){order:3}.balance-screen button{order:4;margin-top:8px}
@media(max-width:480px){.beta-home{padding-bottom:0}.beta-navigation{position:fixed;left:0;right:0;margin:0}.beta-home .authenticated-content{padding-bottom:calc(72px + env(safe-area-inset-bottom))}}

/* Employee Home v2 */
.worker-identity{display:flex;align-items:center;min-width:0;gap:12px}.worker-avatar{flex:0 0 42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#e8f5ec;color:#166534;font-size:.82rem;font-weight:800}.authenticated-home .worker-name{font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#111827}.connection-state{color:#6b7280;font-size:.82rem}.connection-state.online{color:#15803d}.beta-pill{padding:4px 9px;border:1px solid #d1d5db;border-radius:999px;color:#6b7280;background:#fff;font-size:.72rem;font-weight:750}
.attendance-status{display:flex;align-items:center;gap:12px}.attendance-status .attendance-state{display:block;font-size:1.18rem;color:#111827}.attendance-since,.worked-label{color:#6b7280;font-size:.88rem}.state-indicator{width:14px;height:14px;flex:0 0 14px;border:3px solid #d1d5db;border-radius:50%}.state-indicator.state-working{border-color:#16a34a;background:#16a34a}.state-indicator.state-on_break{border-color:#f59e0b;background:#f59e0b}.live-duration{font-size:2rem;line-height:1.15}.break-duration{color:#b45309}.worked-label{margin-bottom:-12px}.overview-card,.shifts-screen{display:grid;gap:9px;padding:18px;border:1px solid #e5e7eb;border-radius:16px;background:#fff}.overview-card{text-align:left;min-height:96px}.overview-title{color:#6b7280;font-weight:700}.week-duration{font-size:1.6rem}.next-shift{color:#111827}.empty-state{color:#6b7280;font-weight:400}.shift-tabs{height:50px;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:3px;border-radius:11px;background:#f3f4f6}.shift-tabs button{height:44px;min-height:44px;display:flex;align-items:center;justify-content:center;padding:10px 18px;border:0;background:transparent;color:#6b7280;line-height:1.2}.shift-tabs button.active{background:#fff;color:#111827}.shift-list{display:grid;gap:10px}.shift-item{position:relative;display:grid;gap:4px;padding:14px;border:1px solid #e5e7eb;border-radius:12px}.shift-item.cancelled{color:#6b7280}.cancelled-label{color:#b45309;font-size:.8rem;font-weight:750}.shifts-screen{min-height:360px;align-content:start;grid-auto-rows:max-content}
@media (prefers-reduced-motion:no-preference){.state-indicator.state-working{animation:working-pulse 2.4s ease-out infinite}@keyframes working-pulse{0%,55%,100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}15%{box-shadow:0 0 0 7px rgba(22,163,74,.16)}}}