.calendar-page{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;min-height:100dvh;width:100%;max-width:100%;display:flex;align-items:center;justify-content:center;overflow-x:hidden;overflow-y:auto;-webkit-text-size-adjust:100%;text-size-adjust:100%;box-sizing:border-box;padding:max(12px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(12px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}.calendar-page *,.calendar-page *:before,.calendar-page *:after{box-sizing:border-box}.calendar-container{width:100%;max-width:420px;min-width:0;padding:8px}.calendar-card{background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;padding:30px;max-width:100%;width:100%;min-width:0}.calendar-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:20px;min-width:0}.calendar-title{margin:0;flex:1;min-width:0;font-size:24px;font-weight:700;color:#2d3748;text-align:center;line-height:1.25;overflow-wrap:anywhere}.calendar-nav{width:44px;height:44px;min-width:44px;min-height:44px;flex-shrink:0;border:none;border-radius:10px;background:#f7fafc;color:#4a5568;font-size:24px;line-height:1;cursor:pointer;transition:background .2s,color .2s,transform .2s;display:flex;align-items:center;justify-content:center;padding:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media(hover:hover)and (pointer:fine){.calendar-nav:hover{background:#667eea;color:#fff;transform:scale(1.08)}.calendar-day:not(.empty):hover{background:#e2e8f0;transform:scale(1.06)}}.calendar-nav:active{background:#667eea;color:#fff}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:10px;text-align:center;font-weight:600;color:#718096;font-size:13px;line-height:1.2}.calendar-weekday{min-width:0;overflow:hidden;text-overflow:clip}.calendar-weekday-short{display:none}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.calendar-day{aspect-ratio:1;width:100%;min-width:0;min-height:36px;display:flex;align-items:center;justify-content:center;border:none;border-radius:10px;font:inherit;font-size:16px;font-weight:500;color:#2d3748;cursor:pointer;transition:background .2s,color .2s,transform .2s,box-shadow .2s;background:#f7fafc;padding:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.calendar-day.empty{background:transparent;cursor:default;pointer-events:none}.calendar-day.today{background:#667eea;color:#fff;font-weight:700}.calendar-day.selected{background:#764ba2;color:#fff;box-shadow:0 0 0 2px #764ba259}.calendar-day:not(.empty):active{background:#e2e8f0}.calendar-day.today:not(.empty):active,.calendar-day.selected:not(.empty):active{filter:brightness(.95)}@media(max-width:760px){.calendar-page{align-items:stretch;justify-content:flex-start}.calendar-container{max-width:none;margin:auto 0;padding:0}.calendar-card{padding:18px 14px 20px;border-radius:20px;box-shadow:0 12px 36px #00000038}.calendar-header{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title title" "prev next";gap:12px 8px;margin-bottom:16px}.calendar-title{grid-area:title;font-size:20px}.calendar-nav-prev{grid-area:prev;justify-self:start}.calendar-nav-next{grid-area:next;justify-self:end}.calendar-weekdays{gap:4px;font-size:12px}.calendar-grid{gap:4px}.calendar-day{aspect-ratio:auto;min-height:44px;height:44px;font-size:16px;border-radius:8px}}@media(max-width:480px){.calendar-page{padding:max(10px,env(safe-area-inset-top,0px)) max(10px,env(safe-area-inset-right,0px)) max(10px,env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-left,0px))}.calendar-card{padding:16px 12px 18px;border-radius:18px}.calendar-title{font-size:18px}.calendar-weekday-full{display:none}.calendar-weekday-short{display:inline}}@media(max-width:360px){.calendar-card{padding:14px 10px 16px}.calendar-title{font-size:17px}.calendar-day{font-size:15px;min-height:42px;height:42px}}@media(prefers-reduced-motion:reduce){.calendar-nav,.calendar-day{transition:none}.calendar-nav:hover,.calendar-day:not(.empty):hover,.calendar-day.selected{transform:none}}
