.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}.clock-card{display:flex;flex-direction:column;align-items:center;text-align:center}.clock-title{margin:0 0 22px;width:100%;font-size:24px;font-weight:700;color:#2d3748;line-height:1.25}.clock-face{position:relative;width:min(72vw,280px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 50%,#ffffff 0 62%,transparent 63%),radial-gradient(circle at 34% 30%,rgba(255,255,255,.55),transparent 46%),linear-gradient(160deg,#f7fafc,#edf2f7);box-shadow:inset 0 0 0 10px #2d3748,inset 0 0 0 14px #667eea,0 16px 36px #2d37482e}.clock-mark,.clock-numeral-slot,.clock-hand,.clock-pivot{position:absolute;left:50%;top:50%}.clock-mark{width:2px;height:46%;margin-left:-1px;margin-top:-46%;background:linear-gradient(#a0aec0 0 8px,transparent 8px);transform-origin:50% 100%}.clock-mark.major{width:3px;margin-left:-1.5px;background:linear-gradient(#4a5568 0 12px,transparent 12px)}.clock-numeral-slot{width:0;height:38%;margin-top:-38%;display:flex;justify-content:center;transform-origin:50% 100%}.clock-numeral{font-size:18px;font-weight:700;color:#2d3748;line-height:1.2}.clock-hand{background:#2d3748;border-radius:8px;transform-origin:50% 100%}.clock-hand.hour{width:6px;height:24%;margin-left:-3px;margin-top:-24%;z-index:2}.clock-hand.minute{width:4px;height:34%;margin-left:-2px;margin-top:-34%;z-index:3}.clock-hand.second{width:2px;height:38%;margin-left:-1px;margin-top:-38%;background:#c53030;z-index:4}.clock-pivot{width:14px;height:14px;margin-left:-7px;margin-top:-7px;border-radius:50%;background:#c53030;box-shadow:0 0 0 4px #2d3748;z-index:5}.clock-digital{margin:22px 0 6px;font-size:36px;font-weight:700;letter-spacing:.06em;color:#2d3748;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.clock-date{margin:0;font-size:15px;font-weight:500;color:#718096}@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:22px 16px 24px;border-radius:20px;box-shadow:0 12px 36px #00000038}.clock-title{font-size:20px;margin-bottom:18px}.clock-digital{font-size:32px}}@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:18px 14px 20px;border-radius:18px}.clock-title{font-size:18px}.clock-numeral{font-size:16px}.clock-digital{margin-top:18px;font-size:28px}}@media(max-width:360px){.calendar-card{padding:16px 12px 18px}.clock-title{font-size:17px}.clock-digital{font-size:26px}}@media(prefers-reduced-motion:reduce){.clock-hand{transition:none}}