*{box-sizing:border-box;margin:0;padding:0}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;color:#333;background-color:#fafafa;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;height:100vh}button{font-family:inherit}.month-calendar{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px;min-width:280px}.month-header{font-size:16px;font-weight:600;text-align:center;margin-bottom:12px;color:#333}.calendar-grid{display:flex;flex-direction:column}.weekday-header{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:8px}.weekday{text-align:center;font-size:12px;font-weight:600;color:#666;padding:4px}.days-grid{display:flex;flex-direction:column;gap:4px}.week-row{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.calendar-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s;background:#f9f9f9;color:#333}.calendar-day:hover{background:#e8e8e8;transform:scale(1.05)}.calendar-day.other-month{color:#ccc;background:#fafafa}.calendar-day.vacation{background:#9333ea;color:#fff;font-weight:600}.calendar-day.vacation:hover{background:#7c3aed}.calendar-day.holiday{background:#ef4444;color:#fff;font-weight:600}.calendar-day.holiday:hover{background:#dc2626}.calendar-day.selected{box-shadow:0 0 0 2px #3b82f6;transform:scale(1.05)}.year-view{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px;max-width:1400px;margin:0 auto;overflow-y:auto;flex:1}@media (max-width: 1400px){.year-view{grid-template-columns:repeat(3,1fr)}}@media (max-width: 1000px){.year-view{grid-template-columns:repeat(2,1fr)}}@media (max-width: 650px){.year-view{grid-template-columns:1fr}}.sidebar{min-width:280px;max-width:320px;padding:24px;background:#f8f9fa;border-left:1px solid #e0e0e0;display:flex;flex-direction:column;gap:24px;height:100vh;overflow-y:auto}.remaining-days-section{text-align:center;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.remaining-label{font-size:14px;color:#666;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.remaining-count{font-size:72px;font-weight:700;color:#9333ea;line-height:1}.grant-breakdown{font-size:13px;color:#666;margin-top:12px;line-height:1.5}.balance-details{background:#fff;padding:16px;border-radius:8px;display:flex;flex-direction:column;gap:12px}.balance-item{display:flex;justify-content:space-between;align-items:center;font-size:14px}.balance-item.expiring{color:#ef4444;font-weight:600}.balance-label{color:#666}.balance-value{font-weight:600;color:#333}.button-group{display:flex;flex-direction:column;gap:12px}.btn{padding:12px 16px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;text-align:center}.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-vacation{background:#9333ea;color:#fff}.btn-vacation:hover:not(:disabled){background:#7c3aed}.btn-holiday{background:#ef4444;color:#fff}.btn-holiday:hover:not(:disabled){background:#dc2626}.btn-clear{background:#6b7280;color:#fff}.btn-clear:hover:not(:disabled){background:#4b5563}.btn-secondary{background:#fff;color:#333;border:1px solid #e0e0e0}.selected-date-info{padding:12px;background:#fff;border-radius:6px;text-align:center;font-size:14px;color:#666;border:1px solid #e0e0e0}@media (max-width: 1000px){.sidebar{min-width:100%;max-width:100%;height:auto;border-left:none;border-top:1px solid #e0e0e0}}.settings-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.settings-modal{background:#fff;border-radius:12px;width:90%;max-width:700px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.settings-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid #e0e0e0}.settings-header h2{margin:0;font-size:24px;font-weight:700;color:#333}.close-btn{background:none;border:none;font-size:32px;line-height:1;color:#666;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-btn:hover{background:#f0f0f0;color:#333}.settings-body{padding:24px}.form-group{margin-bottom:24px}.form-group label{display:block;font-weight:600;margin-bottom:8px;color:#333}.form-group input{width:100%;padding:10px 12px;border:1px solid #d0d0d0;border-radius:6px;font-size:14px;font-family:inherit;transition:border-color .2s}.form-group input:focus{outline:none;border-color:#9333ea}.help-text{display:block;font-size:12px;color:#666;margin-top:4px}.settings-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid #e0e0e0}.btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary{background:#9333ea;color:#fff}.btn-primary:hover{background:#7c3aed}.btn-secondary{background:#fff;color:#333;border:1px solid #d0d0d0}.btn-secondary:hover{background:#f8f9fa}.grants-section{margin-top:32px;padding-top:24px;border-top:1px solid #e0e0e0}.grants-section h3{margin:0 0 16px;font-size:18px;font-weight:700;color:#333}.grants-section h4{margin:0 0 12px;font-size:14px;font-weight:600;color:#333}.grants-list{margin-bottom:24px}.no-grants{padding:16px;background:#f8f9fa;border-radius:6px;text-align:center;color:#666;font-size:14px;margin:0}.grant-item{display:flex;align-items:center;justify-content:space-between;padding:12px;background:#f8f9fa;border-radius:6px;margin-bottom:8px;border:1px solid #e0e0e0;transition:all .2s}.grant-item:hover{background:#f0f0f0}.grant-item.expired{opacity:.6;background:#fff3cd}.grant-info{display:flex;flex-direction:column;gap:4px;flex:1}.grant-date{font-weight:600;color:#333;font-size:14px}.grant-days{font-size:13px;color:#666}.grant-expiry{font-size:12px;color:#888}.btn-delete{background:#dc3545;color:#fff;border:none;border-radius:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;line-height:1;transition:all .2s;flex-shrink:0}.btn-delete:hover{background:#c82333}.add-grant-form{padding:16px;background:#f8f9fa;border-radius:6px;border:1px solid #e0e0e0}.form-row{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:12px;align-items:flex-end}.form-row .form-group{margin-bottom:0}.btn-add-grant{flex-shrink:0;white-space:nowrap;height:42px}@media (max-width: 768px){.form-row{grid-template-columns:1fr}.btn-add-grant{width:100%}}.app{display:flex;flex-direction:column;height:100vh;background:#fafafa}.app-header{background:#fff;padding:20px 24px;box-shadow:0 2px 4px #0000001a;border-bottom:1px solid #e0e0e0}.app-header h1{margin:0;font-size:24px;font-weight:700;color:#333}.app-content{display:flex;flex:1;overflow:hidden}.app-loading{display:flex;align-items:center;justify-content:center;height:100vh;background:#fafafa}.loader{font-size:24px;font-weight:600;color:#9333ea}@media (max-width: 1000px){.app-content{flex-direction:column-reverse}}