*{box-sizing:border-box;margin:0;padding:0}:root{font-family:Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}button{font-family:inherit;cursor:pointer;transition:all .2s}button:focus,button:focus-visible{outline:2px solid #667eea;outline-offset:2px}.dt{margin:0;padding:0;box-sizing:border-box}.dt-body{background:#1b1b1b;font-size:2rem;font-family:sans-serif;color:#eaf0f3}.container{width:15rem;text-align:center;padding-top:12px;border-radius:16px;border:2px solid rgb(8,8,8)}.current{width:10rem;height:15rem;background-color:#60ad6d}.forecast{width:7rem;height:8rem;background-color:#353839}.temp{font-size:1.4em}.summary,.location{font-size:.5em}.forecast>.temp{font-size:.7em}.forecast>.summary{font-size:.3em}.forecast>.location{font-size:.4em}.weather-icon{height:6rem}.weather-icon-forecast{height:3rem}.traffic-frame{width:55rem;height:45rem;align-self:stretch}.weather-container{display:flex;flex-direction:column;align-items:center}.wrapper{background:linear-gradient(#323b33,#242124);display:flex;flex-direction:row;flex-wrap:wrap;max-width:100rem;align-items:stretch;align-content:stretch;align-self:stretch}.calendar-container{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;padding:24px;width:450px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:all .3s ease}.settings-bar{display:flex;justify-content:center;gap:8px;margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0}.settings-btn{background:transparent;border:1px solid #e0e0e0;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:16px;transition:all .2s}.settings-btn:hover{background:#f0f0f0;border-color:#ccc}.time-display{text-align:center;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid #e0e0e0}.current-time{font-size:56px;font-weight:300;color:#333;margin-bottom:8px}.current-date{font-size:18px;color:#666}.calendar{display:flex;flex-direction:column}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.navigation{display:flex;align-items:center;gap:8px;flex:1}.nav-btn{background:transparent;border:none;font-size:20px;cursor:pointer;padding:4px 8px;color:#666;border-radius:4px;transition:all .2s}.nav-btn:hover{background:#f0f0f0;color:#333}.month-year{font-size:18px;font-weight:600;color:#333;flex:1;text-align:center}.today-btn{background:#667eea;color:#fff;border:none;padding:8px 18px;border-radius:6px;cursor:pointer;font-size:15px;font-weight:500;transition:all .2s}.today-btn:hover{background:#5568d3;transform:translateY(-1px);box-shadow:0 2px 8px #667eea66}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.day-name{text-align:center;font-size:13px;font-weight:600;color:#999;padding:10px 0;text-transform:uppercase}.calendar-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:16px;color:#333;border-radius:6px;cursor:pointer;transition:all .2s}.calendar-day:hover{background:#f5f5f5}.calendar-day.other-month{color:#999}.calendar-day.other-month:hover{background:#f5f5f5}.calendar-day.today{background:#667eea;color:#fff;font-weight:600}.calendar-day.today:hover{background:#5568d3}.month-selector{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(2,1fr);gap:8px;margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0}.month-btn{background:transparent;border:1px solid #e0e0e0;padding:10px 8px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;color:#666;transition:all .2s}.month-btn:hover{background:#f5f5f5;border-color:#ccc;color:#333}.month-btn.selected{background:#667eea;color:#fff;border-color:#667eea;font-weight:600}.month-btn.selected:hover{background:#5568d3;border-color:#5568d3}.calendar-container.theme-dark{background:#1e1e1e;box-shadow:0 10px 40px #00000080}.theme-dark .current-time,.theme-dark .month-year{color:#e0e0e0}.theme-dark .current-date{color:#b0b0b0}.theme-dark .time-display{border-bottom-color:#3a3a3a}.theme-dark .nav-btn{color:#b0b0b0}.theme-dark .nav-btn:hover{background:#2a2a2a;color:#e0e0e0}.theme-dark .settings-btn{border-color:#3a3a3a;color:#b0b0b0}.theme-dark .settings-btn:hover{background:#2a2a2a;border-color:#4a4a4a;color:#e0e0e0}.theme-dark .day-name{color:gray}.theme-dark .calendar-day{color:#e0e0e0}.theme-dark .calendar-day:hover{background:#2a2a2a}.theme-dark .calendar-day.other-month{color:#606060}.theme-dark .calendar-day.other-month:hover{background:#2a2a2a}.theme-dark .month-selector,.theme-dark .settings-bar{border-top-color:#3a3a3a}.theme-dark .month-btn{border-color:#3a3a3a;color:#b0b0b0}.theme-dark .month-btn:hover{background:#2a2a2a;border-color:#4a4a4a;color:#e0e0e0}.font-small .current-time{font-size:42px}.font-small .current-date{font-size:14px}.font-small .month-year{font-size:15px}.font-small .today-btn{font-size:13px;padding:6px 14px}.font-small .day-name{font-size:11px;padding:8px 0}.font-small .calendar-day{font-size:14px}.font-small .month-btn{font-size:11px;padding:8px 6px}.font-large .current-time{font-size:68px}.font-large .current-date,.font-large .month-year{font-size:20px}.font-large .today-btn{font-size:17px;padding:10px 20px}.font-large .day-name{font-size:14px;padding:12px 0}.font-large .calendar-day{font-size:18px}.font-large .month-btn{font-size:15px;padding:12px 10px}.font-large .calendar-container{width:500px}.font-small .calendar-container{width:400px}#app{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(#323b33,#242124)}