*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}@media (max-width:768px){html{font-size:14px}}@media (max-width:480px){html{font-size:13px}}body{font-family:'Noto Sans SC','Inter',sans-serif;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;color:#333}.container{max-width:1200px;margin:0 auto;padding:20px;min-height:100vh;display:flex;flex-direction:column;width:100%}.header{background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);padding:30px;border-radius:20px;margin-bottom:30px;box-shadow:0 8px 32px rgba(0,0,0,0.1);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.title{font-size:clamp(1.8rem,4vw,2.5rem);font-weight:700;color:#2d3748;display:flex;align-items:center;gap:15px;line-height:1.2;margin:0;padding:0}.title i{color:#667eea}.home-link{color:#667eea;text-decoration:none;transition:all 0.3s ease;margin-right:10px;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:rgba(102,126,234,0.1);margin-top:0;margin-bottom:0;padding:0}.home-link:hover{color:#5a67d8;background:rgba(102,126,234,0.2);transform:translateY(-2px)}.home-link i{font-size:1.2em}.current-date-display{text-align:right}.today-info{display:flex;flex-direction:column;gap:8px}.solar-date{font-size:clamp(1.2rem,3vw,1.5rem);font-weight:600;color:#2d3748}.lunar-date{font-size:1.1rem;color:#718096;font-weight:500}.main-content{display:grid;grid-template-columns:1fr 400px;gap:30px;flex:1;align-items:start}.calendar-section{background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:20px;padding:30px;box-shadow:0 8px 32px rgba(0,0,0,0.1)}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.nav-btn{background:#667eea;color:white;border:none;border-radius:12px;padding:12px 16px;cursor:pointer;transition:all 0.3s ease;font-size:1.1rem;min-height:44px;min-width:44px;touch-action:manipulation}.nav-btn:hover{background:#5a67d8;transform:translateY(-2px)}.month-year{font-size:clamp(1.4rem,3.5vw,1.8rem);font-weight:600;color:#2d3748;cursor:pointer;padding:8px 16px;border-radius:8px;transition:all 0.3s ease;user-select:none}.month-year:hover{background:rgba(102,126,234,0.1);color:#667eea}.month-picker{position:absolute;opacity:0;pointer-events:none;font-size:1rem;padding:8px;border:2px solid #667eea;border-radius:8px;background:white;color:#2d3748;z-index:1000}.calendar-grid{width:100%}.weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;margin-bottom:10px}.weekday{padding:15px 0;text-align:center;font-weight:600;color:#4a5568;background:#f7fafc;border-radius:8px}.days{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.day{aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;border-radius:12px;transition:all 0.3s ease;padding:10px;position:relative;background:white;border:2px solid transparent;min-height:70px;touch-action:manipulation}.day:hover{background:#edf2f7;transform:scale(1.05)}.day.selected{background:#667eea;color:white;border-color:#5a67d8}.day.today{background:#38b2ac;color:white;font-weight:700}.day.other-month{visibility:hidden;background:transparent}.day.festival{color:#e53e3e!important;font-weight:600}.day-number{font-size:1.3rem;font-weight:600;margin-bottom:3px}.day-info{font-size:0.85rem;text-align:center;line-height:1.3;opacity:0.8}.info-section{display:flex;flex-direction:column;gap:25px}.card{background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-radius:16px;padding:25px;box-shadow:0 8px 32px rgba(0,0,0,0.1)}.card h3{font-size:1.3rem;font-weight:600;color:#2d3748;margin-bottom:20px;display:flex;align-items:center;gap:10px}.card h3 i{color:#667eea}.date-details{display:flex;flex-direction:column;gap:12px}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #e2e8f0}.detail-item:last-child{border-bottom:none}.label{font-weight:600;color:#4a5568}.value{font-weight:500;color:#2d3748;text-align:right;max-width:60%}.calculator-content{display:flex;flex-direction:column;gap:15px}.input-group{display:flex;flex-direction:column;gap:8px}.input-group label{font-weight:600;color:#4a5568}.date-input{padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:border-color 0.3s ease;min-height:44px;width:100%}.date-input:focus{outline:none;border-color:#667eea}.result-display{background:#f7fafc;padding:15px;border-radius:8px;border-left:4px solid #667eea}.interval-result{font-size:1.1rem;font-weight:600;color:#2d3748;text-align:center}.festival-settings{display:flex;align-items:center;gap:10px;margin-bottom:15px;padding:10px 0;border-bottom:1px solid #e2e8f0}.festival-settings label{font-weight:600;color:#4a5568;font-size:0.9rem}.festival-count-select{padding:6px 12px;border:2px solid #e2e8f0;border-radius:6px;font-size:0.9rem;background:white;cursor:pointer;transition:border-color 0.3s ease}.festival-count-select:focus{outline:none;border-color:#667eea}.festivals-list{display:flex;flex-direction:column;gap:12px}.festival-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#f7fafc;border-radius:8px;transition:all 0.3s ease}.festival-item:hover{background:#edf2f7;transform:translateX(5px)}.festival-name{font-weight:600;color:#2d3748}.festival-countdown{font-size:0.9rem;color:#667eea;font-weight:500}.footer{background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);padding:20px;border-radius:16px;margin-top:30px;text-align:center;color:white;font-weight:500}@media (max-width:1200px){.container{max-width:100%;padding:15px}.main-content{grid-template-columns:1fr 350px;gap:20px}}@media (max-width:992px){.container{padding:12px}.main-content{grid-template-columns:1fr;gap:15px}.info-section{display:grid;grid-template-columns:1fr 1fr;gap:15px}.upcoming-festivals{grid-column:1 / -1}.header{flex-direction:column;text-align:center;gap:15px;padding:20px;margin-bottom:20px}.current-date-display{text-align:center}}@media (max-width:768px){.container{padding:10px}.header{padding:15px;margin-bottom:15px}.calendar-section,.card{padding:15px}.info-section{grid-template-columns:1fr;gap:12px}.main-content{gap:12px}.day{padding:4px;min-height:50px}.day-number{font-size:0.9rem}.day-info{font-size:0.55rem}.weekday{padding:8px 0;font-size:0.85rem}}@media (max-width:480px){.container{padding:8px}.header{padding:12px;margin-bottom:12px}.calendar-section,.card{padding:12px}.nav-btn{padding:8px 10px;font-size:0.9rem}.weekday{padding:6px 0;font-size:0.8rem}.day{padding:2px;min-height:45px}.day-number{font-size:0.8rem}.day-info{font-size:0.5rem}.main-content{gap:10px}.info-section{gap:10px}.card h3{font-size:1.1rem}}@media (max-width:360px){.container{padding:5px}.header{padding:10px;margin-bottom:10px}.calendar-section,.card{padding:10px}.day{min-height:40px;padding:1px}.day-number{font-size:0.75rem}.day-info{font-size:0.45rem}.weekday{padding:4px 0;font-size:0.75rem}.nav-btn{padding:6px 8px;font-size:0.8rem}.main-content{gap:8px}.info-section{gap:8px}}.day.major-festival{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:white}.day.traditional-festival{background:linear-gradient(135deg,#feca57,#ff9ff3);color:white}.day.solar-term{background:linear-gradient(135deg,#48dbfb,#0abde3);color:white}.day.shopping-festival{background:linear-gradient(135deg,#ff9ff3,#54a0ff);color:white}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.card{animation:fadeIn 0.6s ease-out}.theme-toggle{background:rgba(102,126,234,0.1);border:none;border-radius:50%;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;color:#667eea;font-size:1.4rem;margin-left:15px;align-self:center;margin:0;padding:0;line-height:1}.theme-toggle:hover{background:rgba(102,126,234,0.2);transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,0.3)}body.dark-mode{background:linear-gradient(135deg,#1a202c 0%,#2d3748 100%);color:#e2e8f0}body.dark-mode .header,body.dark-mode .calendar-section,body.dark-mode .info-section .card{background:rgba(45,55,72,0.95);backdrop-filter:blur(10px);color:#e2e8f0;box-shadow:0 8px 32px rgba(0,0,0,0.3)}body.dark-mode .title{color:#e2e8f0}body.dark-mode .solar-date{color:#e2e8f0}body.dark-mode .lunar-date{color:#a0aec0}body.dark-mode .month-year{color:#e2e8f0}body.dark-mode .weekdays{background:transparent}body.dark-mode .weekday{color:#a0aec0;background:transparent}body.dark-mode .days{background:transparent}body.dark-mode .day{color:#e2e8f0;background:transparent;border-color:#4a5568}body.dark-mode .day.other-month{color:#4a5568}body.dark-mode .day.today{background:linear-gradient(135deg,#667eea,#764ba2);color:white;border-color:#667eea}body.dark-mode .day.selected{background:rgba(102,126,234,0.2);border-color:#667eea}body.dark-mode .day:hover{background:rgba(102,126,234,0.1);border-color:rgba(102,126,234,0.3)}body.dark-mode .day.festival{background:rgba(255,99,132,0.2);border-color:rgba(255,99,132,0.5)}body.dark-mode .day.solar-term{background:rgba(54,162,235,0.2);border-color:rgba(54,162,235,0.5)}body.dark-mode .day.weekend{background:rgba(255,206,84,0.1);border-color:rgba(255,206,84,0.3)}body.dark-mode .day.has-event::after{background:#667eea}body.dark-mode .card h3{color:#e2e8f0;border-bottom-color:#4a5568}body.dark-mode .date-input,body.dark-mode .festival-count-select{background:rgba(45,55,72,0.8);border-color:#4a5568;color:#e2e8f0}body.dark-mode .date-input:focus,body.dark-mode .festival-count-select:focus{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.1)}body.dark-mode .interval-result{color:#e2e8f0}body.dark-mode .festival-item{background:rgba(45,55,72,0.5);border-color:#4a5568}body.dark-mode .festival-name{color:#e2e8f0}body.dark-mode .festival-date{color:#a0aec0}body.dark-mode .countdown{color:#a0aec0}body.dark-mode .legal-holiday{color:#fc8181}body.dark-mode .calendar-grid,body.dark-mode .weekdays,body.dark-mode .days,body.dark-mode .result-display,body.dark-mode .today-info,body.dark-mode .calendar-header{background:transparent}body.dark-mode .nav-btn{background:#667eea}body.dark-mode .nav-btn:hover{background:#5a67d8}body.dark-mode .home-link{background:rgba(102,126,234,0.2);color:#e2e8f0}body.dark-mode .home-link:hover{background:rgba(102,126,234,0.3)}body.dark-mode .theme-toggle{background:rgba(102,126,234,0.2);color:#e2e8f0}body.dark-mode .theme-toggle:hover{background:rgba(102,126,234,0.3)}body.dark-mode div:not(.header):not(.calendar-section):not(.info-section .card):not(.day):not(.weekday):not(.nav-btn):not(.theme-toggle):not(.home-link){background-color:transparent!important;border-color:#4a5568}@media (max-width:768px){.container{padding:15px}.header{padding:20px;margin-bottom:20px}.main-content{grid-template-columns:1fr;gap:20px}.calendar-section,.info-section .card{padding:20px}.title{font-size:1.8rem}.today-info{text-align:center}}@media (max-width:480px){.container{padding:10px}.header{padding:15px;margin-bottom:15px}.calendar-section,.info-section .card{padding:15px}.title{font-size:1.6rem}.calendar-header{margin-bottom:20px}.nav-btn{padding:10px 12px;font-size:1rem}.weekday,.day{padding:8px 0;font-size:0.9rem}.theme-toggle{width:2.2rem;height:2.2rem;font-size:1.3rem}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:rgba(255,255,255,0.1);border-radius:4px}::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5)}