:root{--bg-color: #0f172a;--text-color: #f8fafc;--primary-color: #3b82f6;--secondary-color: #1e293b;--accent-color: #8b5cf6;--border-color: #334155;--hover-color: #334155;--glass-bg: rgba(30, 41, 59, .7);--glass-border: rgba(255, 255, 255, .1);--holiday-au: #10b981;--holiday-cn: #ef4444;--font-family: "Inter", system-ui, -apple-system, sans-serif}body{margin:0;font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-color);-webkit-font-smoothing:antialiased;min-height:100vh}*{box-sizing:border-box}button{cursor:pointer;font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}.modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:var(--secondary-color);border:1px solid var(--border-color);border-radius:16px;width:100%;max-width:500px;padding:24px;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:slideUp .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.modal-header h2{margin:0;font-size:1.5rem;color:var(--text-color)}.close-btn{background:transparent;border:none;color:var(--text-color);opacity:.6;padding:4px;border-radius:4px;transition:all .2s}.close-btn:hover{opacity:1;background:#ffffff1a}.form-group{margin-bottom:20px}.form-row{display:flex;gap:20px}.form-row .form-group{flex:1}label{display:block;margin-bottom:8px;font-size:.9rem;color:var(--text-color);opacity:.8}input,textarea{width:100%;padding:10px 12px;background:#0003;border:1px solid var(--border-color);border-radius:8px;color:var(--text-color);font-size:1rem;font-family:inherit;transition:border-color .2s}input:focus,textarea:focus{outline:none;border-color:var(--primary-color)}.color-picker{display:flex;gap:10px;flex-wrap:wrap}.color-swatch{width:32px;height:32px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .2s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.selected{border-color:#fff;box-shadow:0 0 0 2px var(--secondary-color)}.modal-actions{display:flex;gap:12px;margin-top:32px}.spacer{flex:1}.save-btn,.cancel-btn,.delete-btn{display:flex;align-items:center;gap:8px;padding:10px 20px;border-radius:8px;font-weight:600;border:none;transition:all .2s}.save-btn{background:var(--primary-color);color:#fff}.save-btn:hover{filter:brightness(1.1)}.cancel-btn{background:transparent;border:1px solid var(--border-color);color:var(--text-color)}.cancel-btn:hover{background:#ffffff0d}.delete-btn{background:#ef44441a;color:#ef4444}.delete-btn:hover{background:#ef444433}.calendar-wrapper{height:100%;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.month-nav{display:flex;align-items:center;gap:20px}.month-nav h2{margin:0;font-size:1.8rem;font-weight:700;min-width:200px;text-align:center}.month-nav button{background:transparent;border:1px solid var(--border-color);color:var(--text-color);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:all .2s}.month-nav button:hover{background:var(--hover-color);border-color:var(--primary-color)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--border-color);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;flex:1}.weekday-header{background:var(--secondary-color);padding:12px;text-align:center;font-weight:600;color:var(--text-color);opacity:.8}.calendar-day{background:var(--secondary-color);min-height:120px;padding:8px;display:flex;flex-direction:column;gap:4px;cursor:pointer;transition:background-color .2s;position:relative}.calendar-day:hover{background:#ffffff05}.calendar-day.other-month{opacity:.4;background:#0003}.calendar-day.selected{background:#3b82f61a;box-shadow:inset 0 0 0 2px var(--primary-color)}.calendar-day.dragging{background:#3b82f633;box-shadow:inset 0 0 0 2px var(--accent-color)}.calendar-day.today .day-number{background:var(--primary-color);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.day-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.day-number{font-size:.9rem;font-weight:500}.add-event-btn{opacity:0;background:transparent;border:none;color:var(--text-color);padding:4px;border-radius:4px;transition:all .2s}.calendar-day:hover .add-event-btn{opacity:1}.add-event-btn:hover{background:#ffffff1a;color:var(--primary-color)}.day-content{display:flex;flex-direction:column;gap:2px;flex:1}.holiday-label{font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.event-item{font-size:.75rem;padding:2px 4px;border-radius:4px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:filter .2s;margin-bottom:1px}.event-item:hover{filter:brightness(1.1)}.selected-view-container{height:100%;display:flex;flex-direction:column}.selected-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.selected-header h2{margin:0;font-size:1.8rem}.count-badge{background:var(--primary-color);color:#fff;padding:2px 12px;border-radius:12px;font-size:.9rem;font-weight:600}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-color);opacity:.6;text-align:center}.groups-container{display:flex;flex-wrap:wrap;gap:24px;overflow-y:auto;padding-right:8px;align-content:flex-start}.date-group-card{background:#0003;border:1px solid var(--border-color);border-radius:16px;padding:20px;min-width:300px;flex:1 1 300px;max-width:400px;display:flex;flex-direction:column;gap:16px;transition:all .3s ease-in-out}.date-group-card.expanded{max-width:100%;flex-basis:100%}.group-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding-bottom:12px}.group-title{display:flex;flex-direction:column}.group-header h3{margin:0;font-size:1.1rem;color:var(--text-color)}.group-range{font-size:.9rem;color:var(--primary-color);font-weight:600}.toggle-expand-btn{background:transparent;border:none;color:var(--text-color);opacity:.6;padding:4px;border-radius:4px;cursor:pointer;transition:all .2s}.toggle-expand-btn:hover{opacity:1;background:#ffffff1a}.group-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.grid-expanded{gap:1px;background:var(--border-color);border:1px solid var(--border-color);border-radius:8px;overflow:hidden}.weekday-header{text-align:center;font-size:.75rem;color:var(--text-color);opacity:.6;padding-bottom:4px}.grid-expanded .weekday-header{background:var(--secondary-color);padding:8px;font-weight:600}.day-cell{display:flex;flex-direction:column;position:relative;transition:all .2s}.day-cell.empty{background:transparent;opacity:.3}.day-cell.today{box-shadow:inset 0 0 0 1px var(--accent-color)}.cell-mini{aspect-ratio:1;border-radius:8px;padding:4px}.cell-mini.selected{background:#3b82f626;border:1px solid rgba(59,130,246,.3);cursor:pointer}.cell-mini.selected:hover{background:#3b82f640;border-color:var(--primary-color)}.cell-expanded{min-height:120px;background:var(--secondary-color);padding:8px;gap:4px}.cell-expanded.selected{background:#3b82f61a}.cell-expanded.empty{background:#0003;opacity:.5}.day-cell-header{display:flex;justify-content:space-between;align-items:flex-start}.day-num{font-size:.8rem;font-weight:600}.cell-expanded .day-num{font-size:.9rem}.day-num.ghost{font-weight:400}.header-actions{display:flex;gap:4px;opacity:0;transition:opacity .2s}.cell-expanded:hover .header-actions{opacity:1}.cell-action-btn{background:transparent;border:none;padding:2px;border-radius:4px;cursor:pointer;color:var(--text-color);opacity:.7}.cell-action-btn:hover{opacity:1;background:#ffffff1a}.cell-action-btn.remove:hover{color:#ef4444}.cell-action-btn.add:hover{color:var(--primary-color)}.mini-remove-btn{opacity:0;background:transparent;border:none;color:var(--text-color);padding:0;cursor:pointer;transition:all .2s}.cell-mini:hover .mini-remove-btn{opacity:.6}.mini-remove-btn:hover{opacity:1!important;color:#ef4444}.mini-holiday-dot{width:6px;height:6px;border-radius:50%;margin-top:2px}.holiday-banner{font-size:.7rem;padding:2px 4px;border-radius:4px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.events-container{display:flex;flex-direction:column;gap:2px;margin-top:auto;width:100%}.mini-event-bar{height:4px;border-radius:2px;width:100%;cursor:pointer;transition:transform .1s}.mini-event-bar:hover{transform:scaleY(1.5)}.event-pill{font-size:.75rem;padding:2px 4px;border-radius:4px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:filter .2s}.event-pill:hover{filter:brightness(1.1)}.mini-add-btn{position:absolute;bottom:2px;right:2px;background:transparent;border:none;color:var(--text-color);opacity:0;padding:2px;border-radius:4px;cursor:pointer;transition:all .2s}.cell-mini:hover .mini-add-btn{opacity:.5}.mini-add-btn:hover{opacity:1!important;background:#ffffff1a;color:var(--primary-color)}.app-container{max-width:1200px;margin:0 auto;padding:20px;min-height:100vh;display:flex;flex-direction:column;gap:20px}.app-header{display:flex;justify-content:space-between;align-items:center;padding:20px;background:var(--secondary-color);border-radius:16px;border:1px solid var(--border-color);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.logo{display:flex;align-items:center;gap:12px;color:var(--primary-color)}.logo h1{margin:0;font-size:1.5rem;font-weight:700;color:var(--text-color)}.controls{display:flex;gap:20px;align-items:center}.view-toggle{display:flex;background:var(--bg-color);padding:4px;border-radius:8px;border:1px solid var(--border-color)}.view-toggle button{display:flex;align-items:center;gap:8px;padding:8px 16px;border:none;background:transparent;color:var(--text-color);border-radius:6px;font-size:.9rem;transition:all .2s}.view-toggle button.active{background:var(--secondary-color);color:var(--primary-color);font-weight:600}.holiday-toggles{display:flex;gap:12px}.holiday-toggles label{display:flex;align-items:center;gap:8px;font-size:.9rem;cursor:pointer;padding:6px 12px;border-radius:6px;border:1px solid var(--border-color);transition:all .2s}.holiday-toggles label.active{background:#3b82f61a;border-color:var(--primary-color);color:var(--primary-color)}.app-content{flex:1;background:var(--secondary-color);border-radius:16px;border:1px solid var(--border-color);padding:24px;min-height:600px}
