@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--bg-color: #0d0f17;--surface-color: rgba(255, 255, 255, .03);--surface-border: rgba(255, 255, 255, .08);--text-primary: #f8fafc;--text-secondary: #94a3b8;--color-office: #3b82f6;--color-office-glow: rgba(59, 130, 246, .5);--color-home: #10b981;--color-home-glow: rgba(16, 185, 129, .5);--color-leave: #f59e0b;--color-holiday: #ef4444;--color-empty: rgba(255, 255, 255, .05);--glass-blur: blur(12px)}body{margin:0;font-family:Outfit,sans-serif;color:var(--text-primary);min-height:100vh;-webkit-font-smoothing:antialiased;background-color:var(--bg-color);background-image:radial-gradient(circle at 15% 50%,rgba(59,130,246,.15),transparent 25%),radial-gradient(circle at 85% 30%,rgba(16,185,129,.15),transparent 25%);background-attachment:fixed;overflow-x:hidden}.app-wrapper{min-height:100vh;position:relative;overflow:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.app-wrapper:before{content:"";position:absolute;inset:0;z-index:-2;transition:background-color 2s ease;pointer-events:none}.bg-state-cloudy:before{background-color:#0a0f1ecc}.bg-state-mixed:before{background-color:#1e3a8a33}.bg-state-sunny:before{background-color:#38bdf81a}.dynamic-background{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}.moon{position:absolute;top:50px;right:15%;width:100px;height:100px;border-radius:50%;background:transparent;box-shadow:-20px 20px #f1f5f9;transition:all 2s ease;opacity:0;transform:translateY(-50px)}.bg-state-cloudy .moon{opacity:.8;transform:translateY(0)}.sun{position:absolute;top:-50px;right:-50px;width:300px;height:300px;background:radial-gradient(circle,rgba(253,224,71,.8) 0%,rgba(253,224,71,.2) 40%,transparent 70%);border-radius:50%;filter:blur(10px);transition:all 2s cubic-bezier(.4,0,.2,1);transform:scale(.5) translate(100px,-100px);opacity:0}.bg-state-mixed .sun{transform:scale(.8) translate(0);opacity:.5}.bg-state-sunny .sun{transform:scale(1) translate(-50px,50px);opacity:1}.cloud{position:absolute;border-radius:50px;filter:blur(4px);transition:all 2s ease}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud-1{width:250px;height:80px;top:15%;left:5%;animation:float 20s infinite ease-in-out}.cloud-1:before{width:120px;height:120px;top:-50px;left:30px}.cloud-1:after{width:90px;height:90px;top:-40px;right:30px}.cloud-2{width:300px;height:100px;top:25%;right:-5%;animation:float 25s infinite ease-in-out reverse}.cloud-2:before{width:150px;height:150px;top:-70px;left:40px}.cloud-2:after{width:120px;height:120px;top:-50px;right:40px}.cloud-3{width:200px;height:70px;bottom:25%;left:15%;animation:float 18s infinite ease-in-out 5s}.cloud-3:before{width:90px;height:90px;top:-40px;left:20px}.cloud-3:after{width:70px;height:70px;top:-30px;right:20px}.bg-state-cloudy .cloud{background:#47556999;transform:scale(1) translate(0);opacity:1}.bg-state-mixed .cloud{background:#94a3b84d;transform:scale(.8) translate(-10vw);opacity:.5}.bg-state-sunny .cloud{background:#ffffff1a;transform:scale(.5) translate(-30vw);opacity:0}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-15px)}to{transform:translateY(0)}}*{box-sizing:border-box}.glass-panel{background:var(--surface-color);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--surface-border);border-radius:20px;box-shadow:0 8px 32px #0003}.app-container{max-width:1200px;margin:0 auto;padding:2rem;display:grid;grid-template-columns:1fr 350px;gap:2rem;align-items:start}@media(max-width:900px){.app-container{grid-template-columns:1fr;padding:1rem}}.header{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}@media(max-width:600px){.header{flex-direction:column;gap:1rem;text-align:center}}.header h1{font-size:2.5rem;font-weight:700;margin:0;background:linear-gradient(135deg,#fff,#94a3b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}@media(max-width:600px){.header h1{font-size:2rem}}.month-selector{display:flex;align-items:center;gap:1rem}.icon-btn{background:var(--surface-color);border:1px solid var(--surface-border);color:var(--text-primary);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.icon-btn:hover{background:#ffffff1a;transform:translateY(-2px);box-shadow:0 4px 12px #0003}.month-display{font-size:1.25rem;font-weight:500;min-width:160px;text-align:center}.calendar{padding:2rem}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1rem}@media(max-width:600px){.calendar-grid{gap:.5rem}}.day-header{text-align:center;font-weight:600;color:var(--text-secondary);font-size:.875rem;padding-bottom:1rem;text-transform:uppercase;letter-spacing:1px}@media(max-width:600px){.day-header{font-size:.75rem;padding-bottom:.5rem;letter-spacing:0}}.day-cell{aspect-ratio:1;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;background:var(--color-empty);border:1px solid transparent;position:relative;overflow:hidden}@media(max-width:600px){.day-cell{border-radius:8px}}.day-cell:not(.empty):hover{transform:scale(1.05);background:#ffffff1a}.day-cell.empty{opacity:.3;cursor:default}.day-cell .date-num{font-size:1.25rem;font-weight:600;z-index:2}@media(max-width:600px){.day-cell .date-num{font-size:1rem}}.day-cell .status-icon{margin-top:4px;opacity:.8;z-index:2}@media(max-width:600px){.day-cell .status-icon{transform:scale(.8);margin-top:2px}}.day-cell.status-office{background:#3b82f626;border-color:var(--color-office);color:var(--color-office);box-shadow:0 0 20px var(--color-office-glow)}.day-cell.status-office:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent,rgba(59,130,246,.1))}.day-cell.status-home{background:#10b98126;border-color:var(--color-home);color:var(--color-home);box-shadow:0 0 20px var(--color-home-glow)}.day-cell.status-leave{background:#f59e0b26;border-color:var(--color-leave);color:var(--color-leave)}.day-cell.status-holiday{background:#ef444426;border-color:var(--color-holiday);color:var(--color-holiday)}.day-cell.is-weekend{opacity:.6}.tracker-sidebar{padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}@media(max-width:600px){.tracker-sidebar{padding:1rem;gap:1rem}}.tracker-sidebar h2{font-size:1.5rem;margin:0;display:flex;align-items:center;gap:.5rem}@media(max-width:600px){.tracker-sidebar h2{font-size:1.25rem}}.week-card{background:#0003;border-radius:12px;padding:1.25rem;border:1px solid var(--surface-border)}@media(max-width:600px){.week-card{padding:1rem}}.week-header{display:flex;justify-content:space-between;margin-bottom:.75rem;font-weight:500}.progress-container{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden;margin-bottom:.5rem}.progress-bar{height:100%;background:var(--color-office);transition:width .5s cubic-bezier(.4,0,.2,1)}.progress-bar.success{background:var(--color-home)}.progress-bar.danger{background:var(--color-holiday)}.week-stats{font-size:.875rem;color:var(--text-secondary);display:flex;justify-content:space-between}.legend{display:flex;justify-content:center;gap:2rem;margin-top:2rem;grid-column:1 / -1;flex-wrap:wrap}@media(max-width:600px){.legend{gap:.75rem;margin-top:1rem}}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--text-secondary);background:var(--surface-color);padding:.5rem 1rem;border-radius:20px;border:1px solid var(--surface-border);cursor:pointer;transition:all .2s ease}@media(max-width:600px){.legend-item{font-size:.75rem;padding:.375rem .75rem}}.monthly-summary{padding:1.5rem;margin-bottom:1.5rem;background:linear-gradient(135deg,#ffffff0d,#ffffff03)}.monthly-summary h2{font-size:1.5rem;margin:0 0 1.5rem}.summary-grid{display:flex;flex-direction:column;gap:1rem}.summary-item{display:flex;align-items:center;gap:1rem;background:#0003;padding:1rem;border-radius:12px;border:1px solid var(--surface-border)}.icon-blue{color:var(--color-office)}.icon-green{color:var(--color-home)}.icon-amber{color:var(--color-leave)}.summary-details{display:flex;flex-direction:column;flex:1}.summary-label{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.summary-value{font-size:1.25rem;font-weight:600;color:var(--text-primary)}.summary-value.highlight{color:var(--color-office)}.summary-progress-wrapper{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--surface-border)}.summary-progress-header{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.875rem;color:var(--text-secondary)}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.animate-pop{animation:popIn .4s cubic-bezier(.4,0,.2,1) forwards}.illustration-face{width:48px;height:48px;border-radius:50%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 12px #0003;transition:all .5s cubic-bezier(.4,0,.2,1);overflow:hidden}.face-eyes{display:flex;gap:12px;margin-bottom:6px;margin-top:-4px}.eye{width:6px;height:8px;background-color:var(--bg-color);border-radius:4px;transition:all .4s ease}.face-mouth{width:20px;height:4px;background-color:var(--bg-color);border-radius:4px;transition:all .4s cubic-bezier(.4,0,.2,1);transform-origin:center top}.illustration-face.is-happy{transform:scale(1.1) rotate(5deg)}.illustration-face.is-happy .eye{height:6px;transform:translateY(2px) scaleY(.8)}.illustration-face.is-happy .face-mouth{height:12px;border-radius:2px 2px 12px 12px;transform:translateY(2px)}.illustration-face.is-meh{transform:scale(1)}.illustration-face.is-meh .face-mouth{width:16px;height:4px;border-radius:4px}.illustration-face.is-sad{transform:scale(.9) rotate(-5deg)}.illustration-face.is-sad .eye{height:6px;transform:translateY(2px)}.illustration-face.is-sad .face-mouth{height:10px;width:16px;border-radius:12px 12px 2px 2px;transform:translateY(4px)}.footer{grid-column:1 / -1;text-align:center;padding:1.5rem 0;margin-top:1rem;font-size:.875rem;color:var(--text-secondary);opacity:.7;letter-spacing:.5px}