.year-calendar { overflow: auto; background: var(--color-bg); }
.year-root { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); grid-auto-rows: 360px; gap: 18px; width: 100%; padding: 20px; align-content: start; }
.year-month { display: flex; width: 100%; height: 360px; min-height: 360px; max-height: 360px; flex-direction: column; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-raised); box-shadow: 0 8px 26px rgba(0,0,0,.2); }
.year-month-header { display: flex; min-height: 52px; align-items: center; justify-content: center; padding: 0 12px; }
.year-month-title { min-height: var(--touch-target); padding: 11px 14px; color: var(--color-text); font-size: .95rem; font-weight: 720; cursor: pointer; user-select: none; } .year-month-title:hover { color: var(--color-accent); }
.year-weekdays { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); min-height: 32px; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.year-weekday { display: flex; align-items: center; justify-content: center; border-right: 1px solid var(--color-border); color: var(--color-text-muted); font-size: .62rem; font-weight: 720; } .year-weekday:last-child { border-right: 0; }
.year-month-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); grid-template-rows: repeat(6,minmax(var(--touch-target),1fr)); flex: 1; min-height: 0; overflow: hidden; }
.year-day { position: relative; display: flex; min-width: 0; min-height: var(--touch-target); align-items: center; justify-content: center; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); color: var(--color-text); font-size: .7rem; cursor: pointer; }
.year-day:nth-child(7n) { border-right: 0; } .year-day:nth-last-child(-n + 7) { border-bottom: 0; }
.year-day-number { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; } .year-day:hover .year-day-number { background: var(--color-surface-hover); }
.year-day.year-has-events .year-day-number { background: #285fae; color: #fff; font-weight: 720; } .year-other-month { color: var(--color-text-muted); opacity: .46; } .year-other-month.year-has-events .year-day-number { background: rgba(61,126,240,.45); }
.year-today .year-day-number { outline: 2px solid var(--color-accent); outline-offset: 1px; } .year-selected .year-day-number { box-shadow: 0 0 0 3px rgba(167,139,250,.48); }
@media (max-width: 1100px) { .year-root { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 720px) { .year-root { grid-template-columns: 1fr; grid-auto-rows: 360px; gap: 12px; padding: 12px; } .year-month { height: 360px; min-height: 360px; max-height: 360px; } }