:where(html){--shadow-color:220 3% 15%;--shadow-strength:1%;--shadow-strength-3:calc(var(--shadow-strength) + 2%);--shadow-strength-4:calc(var(--shadow-strength) + 3%);--shadow-strength-5:calc(var(--shadow-strength) + 4%);--shadow-strength-6:calc(var(--shadow-strength) + 5%);--shadow-strength-7:calc(var(--shadow-strength) + 6%);--shadow-strength-8:calc(var(--shadow-strength) + 7%);--shadow-strength-10:calc(var(--shadow-strength) + 9%);--inner-shadow-highlight:inset 0 -.5px 0 0 #fff,inset 0 .5px 0 0 rgba(0,0,0,.067);--shadow-1:0 1px 2px -1px hsl(var(--shadow-color)/var(--shadow-strength-10));--shadow-2:0 3px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 7px 14px -5px hsl(var(--shadow-color)/var(--shadow-strength-6));--shadow-3:0 -1px 3px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 1px 2px -5px hsl(var(--shadow-color)/var(--shadow-strength-3)),0 2px 5px -5px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 4px 12px -5px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 12px 15px -5px hsl(var(--shadow-color)/var(--shadow-strength-8));--shadow-4:0 -2px 5px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 1px 1px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 2px 2px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 5px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 9px 9px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 16px 16px -2px hsl(var(--shadow-color)/var(--shadow-strength-7));--shadow-5:0 -1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 2px 1px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 5px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 10px 10px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 20px 20px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 40px 40px -2px hsl(var(--shadow-color)/var(--shadow-strength-8));--shadow-6:0 -1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 3px 2px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 7px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 12px 10px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 22px 18px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 41px 33px -2px hsl(var(--shadow-color)/var(--shadow-strength-7)),0 100px 80px -2px hsl(var(--shadow-color)/var(--shadow-strength-8));--inner-shadow-0:inset 0 0 0 1px hsl(var(--shadow-color)/var(--shadow-strength-10));--inner-shadow-1:inset 0 1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-2:inset 0 1px 4px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-3:inset 0 2px 8px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-4:inset 0 2px 14px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight)}@media(prefers-color-scheme:dark){:where(html){--shadow-color:220 40% 2%;--shadow-strength:25%;--inner-shadow-highlight:inset 0 -.5px 0 0 hsla(0,0%,100%,.067),inset 0 .5px 0 0 rgba(0,0,0,.467)}}:where(html){--ease-1:cubic-bezier(.25,0,.5,1);--ease-2:cubic-bezier(.25,0,.4,1);--ease-3:cubic-bezier(.25,0,.3,1);--ease-4:cubic-bezier(.25,0,.2,1);--ease-5:cubic-bezier(.25,0,.1,1);--ease-in-1:cubic-bezier(.25,0,1,1);--ease-in-2:cubic-bezier(.5,0,1,1);--ease-in-3:cubic-bezier(.7,0,1,1);--ease-in-4:cubic-bezier(.9,0,1,1);--ease-in-5:cubic-bezier(1,0,1,1);--ease-out-1:cubic-bezier(0,0,.75,1);--ease-out-2:cubic-bezier(0,0,.5,1);--ease-out-3:cubic-bezier(0,0,.3,1);--ease-out-4:cubic-bezier(0,0,.1,1);--ease-out-5:cubic-bezier(0,0,0,1);--ease-in-out-1:cubic-bezier(.1,0,.9,1);--ease-in-out-2:cubic-bezier(.3,0,.7,1);--ease-in-out-3:cubic-bezier(.5,0,.5,1);--ease-in-out-4:cubic-bezier(.7,0,.3,1);--ease-in-out-5:cubic-bezier(.9,0,.1,1);--ease-elastic-out-1:cubic-bezier(.5,.75,.75,1.25);--ease-elastic-out-2:cubic-bezier(.5,1,.75,1.25);--ease-elastic-out-3:cubic-bezier(.5,1.25,.75,1.25);--ease-elastic-out-4:cubic-bezier(.5,1.5,.75,1.25);--ease-elastic-out-5:cubic-bezier(.5,1.75,.75,1.25);--ease-elastic-in-1:cubic-bezier(.5,-.25,.75,1);--ease-elastic-in-2:cubic-bezier(.5,-.5,.75,1);--ease-elastic-in-3:cubic-bezier(.5,-.75,.75,1);--ease-elastic-in-4:cubic-bezier(.5,-1,.75,1);--ease-elastic-in-5:cubic-bezier(.5,-1.25,.75,1);--ease-elastic-in-out-1:cubic-bezier(.5,-.1,.1,1.5);--ease-elastic-in-out-2:cubic-bezier(.5,-.3,.1,1.5);--ease-elastic-in-out-3:cubic-bezier(.5,-.5,.1,1.5);--ease-elastic-in-out-4:cubic-bezier(.5,-.7,.1,1.5);--ease-elastic-in-out-5:cubic-bezier(.5,-.9,.1,1.5);--ease-step-1:steps(2);--ease-step-2:steps(3);--ease-step-3:steps(4);--ease-step-4:steps(7);--ease-step-5:steps(10);--ease-elastic-1:var(--ease-elastic-out-1);--ease-elastic-2:var(--ease-elastic-out-2);--ease-elastic-3:var(--ease-elastic-out-3);--ease-elastic-4:var(--ease-elastic-out-4);--ease-elastic-5:var(--ease-elastic-out-5);--ease-squish-1:var(--ease-elastic-in-out-1);--ease-squish-2:var(--ease-elastic-in-out-2);--ease-squish-3:var(--ease-elastic-in-out-3);--ease-squish-4:var(--ease-elastic-in-out-4);--ease-squish-5:var(--ease-elastic-in-out-5);--ease-spring-1:linear(0,.006,.025 2.8%,.101 6.1%,.539 18.9%,.721 25.3%,.849 31.5%,.937 38.1%,.968 41.8%,.991 45.7%,1.006 50.1%,1.015 55%,1.017 63.9%,1.001);--ease-spring-2:linear(0,.007,.029 2.2%,.118 4.7%,.625 14.4%,.826 19%,.902,.962,1.008 26.1%,1.041 28.7%,1.064 32.1%,1.07 36%,1.061 40.5%,1.015 53.4%,.999 61.6%,.995 71.2%,1);--ease-spring-3:linear(0,.009,.035 2.1%,.141 4.4%,.723 12.9%,.938 16.7%,1.017,1.077,1.121,1.149 24.3%,1.159,1.163,1.161,1.154 29.9%,1.129 32.8%,1.051 39.6%,1.017 43.1%,.991,.977 51%,.974 53.8%,.975 57.1%,.997 69.8%,1.003 76.9%,1);--ease-spring-4:linear(0,.009,.037 1.7%,.153 3.6%,.776 10.3%,1.001,1.142 16%,1.185,1.209 19%,1.215 19.9% 20.8%,1.199,1.165 25%,1.056 30.3%,1.008 33%,.973,.955 39.2%,.953 41.1%,.957 43.3%,.998 53.3%,1.009 59.1% 63.7%,.998 78.9%,1);--ease-spring-5:linear(0,.01,.04 1.6%,.161 3.3%,.816 9.4%,1.046,1.189 14.4%,1.231,1.254 17%,1.259,1.257 18.6%,1.236,1.194 22.3%,1.057 27%,.999 29.4%,.955 32.1%,.942,.935 34.9%,.933,.939 38.4%,1 47.3%,1.011,1.017 52.6%,1.016 56.4%,1 65.2%,.996 70.2%,1.001 87.2%,1);--ease-bounce-1:linear(0,.004,.016,.035,.063,.098,.141,.191,.25,.316,.391 36.8%,.563,.766,1 58.8%,.946,.908 69.1%,.895,.885,.879,.878,.879,.885,.895,.908 89.7%,.946,1);--ease-bounce-2:linear(0,.004,.016,.035,.063,.098,.141 15.1%,.25,.391,.562,.765,1,.892 45.2%,.849,.815,.788,.769,.757,.753,.757,.769,.788,.815,.85,.892 75.2%,1 80.2%,.973,.954,.943,.939,.943,.954,.973,1);--ease-bounce-3:linear(0,.004,.016,.035,.062,.098,.141 11.4%,.25,.39,.562,.764,1 30.3%,.847 34.8%,.787,.737,.699,.672,.655,.65,.656,.672,.699,.738,.787,.847 61.7%,1 66.2%,.946,.908,.885 74.2%,.879,.878,.879,.885 79.5%,.908,.946,1 87.4%,.981,.968,.96,.957,.96,.968,.981,1);--ease-bounce-4:linear(0,.004,.016 3%,.062,.141,.25,.391,.562 18.2%,1 24.3%,.81,.676 32.3%,.629,.595,.575,.568,.575,.595,.629,.676 48.2%,.811,1 56.2%,.918,.86,.825,.814,.825,.86,.918,1 77.2%,.94 80.6%,.925,.92,.925,.94 87.5%,1 90.9%,.974,.965,.974,1);--ease-bounce-5:linear(0,.004,.016 2.5%,.063,.141,.25 10.1%,.562,1 20.2%,.783,.627,.534 30.9%,.511,.503,.511,.534 38%,.627,.782,1 48.7%,.892,.815,.769 56.3%,.757,.753,.757,.769 61.3%,.815,.892,1 68.8%,.908 72.4%,.885,.878,.885,.908 79.4%,1 83%,.954 85.5%,.943,.939,.943,.954 90.5%,1 93%,.977,.97,.977,1);--ease-circ-in:cubic-bezier(.6,.04,.98,.335);--ease-circ-in-out:cubic-bezier(.785,.135,.15,.86);--ease-circ-out:cubic-bezier(.075,.82,.165,1);--ease-cubic-in:cubic-bezier(.55,.055,.675,.19);--ease-cubic-in-out:cubic-bezier(.645,.045,.355,1);--ease-cubic-out:cubic-bezier(.215,.61,.355,1);--ease-expo-in:cubic-bezier(.95,.05,.795,.035);--ease-expo-in-out:cubic-bezier(1,0,0,1);--ease-expo-out:cubic-bezier(.19,1,.22,1);--ease-quad-in:cubic-bezier(.55,.085,.68,.53);--ease-quad-in-out:cubic-bezier(.455,.03,.515,.955);--ease-quad-out:cubic-bezier(.25,.46,.45,.94);--ease-quart-in:cubic-bezier(.895,.03,.685,.22);--ease-quart-in-out:cubic-bezier(.77,0,.175,1);--ease-quart-out:cubic-bezier(.165,.84,.44,1);--ease-quint-in:cubic-bezier(.755,.05,.855,.06);--ease-quint-in-out:cubic-bezier(.86,0,.07,1);--ease-quint-out:cubic-bezier(.23,1,.32,1);--ease-sine-in:cubic-bezier(.47,0,.745,.715);--ease-sine-in-out:cubic-bezier(.445,.05,.55,.95);--ease-sine-out:cubic-bezier(.39,.575,.565,1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{color-scheme:light dark;--accent: #c0274a;--accent-bg: #b02544;--accent-bg-hover: #cf2e52;--bg: #f4f5f7;--bg-input: #e8eaed;--bg-surface: #ffffff;--border: rgba(0, 0, 0, .1);--danger: #c0392b;--danger-hover: #e74c3c;--gap: 1rem;--radius: 8px;--success: #1a7f4b;--text: #1a1a2e;--text-muted: #5a5a6e;--warning: #b8860b;--badge-office: #2d6a4f;--badge-office-bg: #d4edda;--badge-wfh: #1d4e89;--badge-wfh-bg: #d0e0f0;--badge-leave: #7b2d8b;--badge-leave-bg: #e8d5f0;--badge-sick: #9a5218;--badge-sick-bg: #f0e0d0;--badge-holiday: #555e68;--badge-holiday-bg: #e0e2e5}[data-theme=dark]{--accent: #e94560;--accent-bg: #bf3048;--accent-bg-hover: #d43d57;--bg: #1a1a2e;--bg-input: #0f3460;--bg-surface: #16213e;--border: rgba(255, 255, 255, .1);--danger: #c0392b;--danger-hover: #e74c3c;--success: #4caf7c;--text: #e0e0e0;--text-muted: #a0a0b0;--warning: #e6a23c;--badge-office: #fff;--badge-office-bg: #2d6a4f;--badge-wfh: #fff;--badge-wfh-bg: #1d4e89;--badge-leave: #fff;--badge-leave-bg: #7b2d8b;--badge-sick: #fff;--badge-sick-bg: #9a5218;--badge-holiday: #fff;--badge-holiday-bg: #6c757d}@media(prefers-color-scheme:dark){[data-theme=auto]{--accent: #e94560;--accent-bg: #bf3048;--accent-bg-hover: #d43d57;--bg: #1a1a2e;--bg-input: #0f3460;--bg-surface: #16213e;--border: rgba(255, 255, 255, .1);--danger: #c0392b;--danger-hover: #e74c3c;--success: #4caf7c;--text: #e0e0e0;--text-muted: #a0a0b0;--warning: #e6a23c;--badge-office: #fff;--badge-office-bg: #2d6a4f;--badge-wfh: #fff;--badge-wfh-bg: #1d4e89;--badge-leave: #fff;--badge-leave-bg: #7b2d8b;--badge-sick: #fff;--badge-sick-bg: #9a5218;--badge-holiday: #fff;--badge-holiday-bg: #6c757d}}html{font-size:16px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100dvh;transition:background-color .2s var(--ease-out-2),color .2s var(--ease-out-2)}#app{margin:0 auto;max-width:600px;padding:var(--gap)}header{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.header-row{align-items:center;display:flex;justify-content:space-between}header h1{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;line-height:1.2}.theme-toggle{align-items:center;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);cursor:pointer;display:flex;justify-content:center;min-height:36px;min-width:36px;padding:.4rem;transition:background .15s var(--ease-out-2),color .15s var(--ease-out-2)}.theme-toggle:hover{color:var(--text)}#main-nav{display:flex;gap:.5rem}.nav-btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-muted);cursor:pointer;font-size:.875rem;min-height:44px;padding:.5rem 1rem;transition:background .15s var(--ease-out-2),color .15s var(--ease-out-2),box-shadow .15s var(--ease-out-2)}.nav-btn:hover{color:var(--text)}.nav-btn.active{background:var(--accent-bg);border-color:var(--accent-bg);color:#fff}.btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;font-size:.9rem;min-height:44px;padding:.6rem 1.2rem;transition:background .15s var(--ease-out-2),box-shadow .15s var(--ease-out-2)}.btn:hover{box-shadow:var(--shadow-2)}.btn-primary{background:var(--accent-bg);border-color:var(--accent-bg);color:#fff}.btn-primary:hover{background:var(--accent-bg-hover)}.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn-danger:hover{background:var(--danger-hover)}.btn-small{font-size:.8rem;padding:.35rem .75rem}.btn-row{display:flex;flex-wrap:wrap;gap:.5rem}.log-form{display:flex;flex-direction:column;gap:var(--gap)}.pin-form{display:flex;flex-direction:column;gap:.75rem}.field-group{display:flex;flex-direction:column;gap:.3rem}.field-group label{color:var(--text-muted);font-size:.8rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase}input,select,textarea{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:inherit;font-size:1rem;min-height:44px;padding:.6rem .8rem;transition:border-color .15s var(--ease-out-2)}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical}.entry-list{display:flex;flex-direction:column;gap:.75rem;list-style:none}.entry-item{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-2);padding:var(--gap);transition:box-shadow .15s var(--ease-out-2)}.entry-summary{align-items:baseline;display:flex;flex-wrap:wrap;gap:.5rem}.entry-date{font-weight:600}.entry-reason{border-radius:999px;font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:.2rem .65rem;text-transform:uppercase}.entry-reason--office{background:var(--badge-office-bg);color:var(--badge-office)}.entry-reason--wfh{background:var(--badge-wfh-bg);color:var(--badge-wfh)}.entry-reason--leave{background:var(--badge-leave-bg);color:var(--badge-leave)}.entry-reason--sick{background:var(--badge-sick-bg);color:var(--badge-sick)}.entry-reason--public-holiday{background:var(--badge-holiday-bg);color:var(--badge-holiday)}.entry-notes{color:var(--text-muted);font-size:.9rem;margin-top:.5rem}.entry-actions{display:flex;gap:.5rem;margin-top:.75rem}.settings-group{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-1);margin-bottom:var(--gap);padding:var(--gap)}.settings-group h3{font-size:1rem;font-weight:600;margin-bottom:.25rem}.settings-group h4{margin-bottom:.25rem;margin-top:1.25rem}.settings-group p{color:var(--text-muted);font-size:.9rem;margin-bottom:.25rem}.settings-group-danger{border-left:3px solid var(--danger)}.warning{color:var(--accent)!important;font-weight:600}.pin-message,.form-message{color:var(--accent);font-size:.85rem;font-weight:600;margin-top:.25rem;min-height:1.2em}.pin-message-success{color:var(--success)}.pin-strength{font-size:.8rem;font-weight:600;margin-top:-.25rem;min-height:1.1em}.pin-strength-weak{color:var(--accent)}.pin-strength-fair{color:var(--warning)}.pin-strength-strong{color:var(--success)}.empty-state{color:var(--text-muted);font-size:1rem;padding:3rem 1rem;text-align:center}h2{font-size:1.25rem;font-weight:600;line-height:1.3;margin-bottom:1rem}h3{font-size:1rem;font-weight:600}.attendance-banner{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-3);margin-bottom:var(--gap);padding:var(--gap);text-align:center}.attendance-percentage{font-size:2rem;font-weight:700;line-height:1.2}.attendance-ok{color:var(--success)}.attendance-below{color:var(--accent)}.attendance-bar{background:var(--bg-input);border-radius:4px;height:8px;margin-top:.75rem;overflow:visible;position:relative}.attendance-fill{border-radius:4px;height:100%;transition:width .3s var(--ease-out-3)}.attendance-fill-ok{background:var(--success)}.attendance-fill-below{background:var(--accent)}.attendance-target{border-left:2px dashed var(--text-muted);height:14px;position:absolute;top:-3px}.attendance-detail{color:var(--text-muted);font-size:.85rem;margin-top:.5rem}.attendance-fields{display:flex;flex-direction:column;gap:.75rem;margin-top:.75rem}.attendance-fields .field-group{max-width:200px}.toggle-row{align-items:center;display:flex;gap:.5rem}.toggle-row label{color:var(--text);cursor:pointer;font-size:.9rem}.settings-version{color:var(--text-muted);font-size:.75rem;margin-top:2rem;text-align:center}.confirm-prompt{color:var(--accent);font-size:.85rem;font-weight:600}.skip-link{background:var(--bg-surface);border:1px solid var(--accent);border-radius:var(--radius);color:var(--text);left:50%;padding:.5rem 1rem;position:absolute;top:-100%;transform:translate(-50%);z-index:100}.skip-link:focus{top:var(--gap)}h2[tabindex="-1"]:focus{outline:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important}}@media(prefers-reduced-motion:no-preference){.btn:active{transform:scale(.97)}.entry-item:hover{box-shadow:var(--shadow-3)}}@media(forced-colors:active){.entry-reason{border:1px solid}.nav-btn.active{border:2px solid}}