.calendar-island.two-column{display:flex;gap:16px;align-items:flex-start;width:100%;max-width:920px;box-sizing:border-box}.calendar-side{width:240px;display:flex;flex-direction:column;gap:12px}.box{background:var(--surface, #fff);border:1px solid var(--border, #e5e7eb);padding:12px;border-radius:8px;color:var(--fg, #111827);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:130px}.box-label{font-weight:600;color:var(--muted, #6b7280);font-size:.85rem}.box-value{margin-top:6px;font-size:1.05rem}.box-sub{margin-top:8px;color:var(--muted, #6b7280);font-size:.9rem}.today-box .box-sub,.selected-box .box-sub{margin-top:12px;font-size:1.6rem;font-weight:800;color:var(--accent, #ff6b6b);background:color-mix(in srgb,var(--accent, #ff6b6b) 8%,transparent);padding:8px 12px;border-radius:8px;min-width:64px}.calendar-wrapper{flex:1;background:var(--surface, #fff);border:1px solid var(--border, #e5e7eb);padding:12px;border-radius:8px}.month-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.month-title{font-weight:700}.nav{background:var(--accent, #3b82f6);border:none;color:var(--accent-foreground, #ffffff);font-size:1.25rem;cursor:pointer;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;box-shadow:0 4px 10px #00000014;transition:transform .14s ease,box-shadow .14s ease,background-color .14s ease}.nav:hover{transform:translateY(-2px);box-shadow:0 6px 14px #0000001f}.nav:active{transform:translateY(0)}.nav:focus{outline:2px solid color-mix(in srgb,var(--accent, #3b82f6) 40%,rgba(255,255,255,0));outline-offset:2px}.month-grid{width:100%;border-collapse:collapse}.month-grid th{text-align:center;padding:6px 4px;color:var(--muted, #6b7280);font-weight:600}.month-grid td{width:14.2857%;text-align:center;padding:6px 4px}.day-cell.empty{opacity:.35}.day-cell button{width:36px;height:36px;border-radius:6px;border:none;background:transparent;cursor:pointer}.day-cell.is-today button{outline:2px solid var(--accent, #3b82f6)}.day-cell.is-selected button{background:var(--accent, #3b82f6);color:var(--accent-foreground, #fff)}.calendar-side,.calendar-wrapper{box-shadow:var(--card-shadow, 0 1px 2px rgba(0,0,0,.04))}@media(max-width:700px){.calendar-island.two-column{flex-direction:column}.calendar-side{width:100%}}.month-grid tr.week-row td{background:color-mix(in srgb,var(--accent, #3b82f6) 8%,transparent)}.month-grid tr.week-row td button{border-radius:6px}.toggle-button{background:transparent;border:none;font-weight:700;cursor:pointer;padding:4px 8px}.months-grid,.years-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:8px}.month-item,.year-item{padding:8px;border-radius:6px;border:1px solid transparent;background:transparent;cursor:pointer;box-shadow:0 0 0 0 transparent}.month-item.is-current,.year-item.is-current{border-color:var(--accent, #3b82f6);background:color-mix(in srgb,var(--accent, #3b82f6) 12%,transparent)}.month-title.toggle-button{cursor:pointer;transition:background-color .14s ease,transform .12s ease}.month-title.toggle-button:hover,.month-title.toggle-button:focus{background:color-mix(in srgb,var(--accent, #3b82f6) 12%,transparent);transform:translateY(-2px)}.month-title.toggle-button:focus{outline:2px solid color-mix(in srgb,var(--accent, #3b82f6) 40%,rgba(255,255,255,0));outline-offset:2px}.month-item,.year-item{transition:background-color .14s ease,transform .12s ease,box-shadow .12s ease}.month-item:hover,.year-item:hover{background:color-mix(in srgb,var(--accent, #3b82f6) 10%,transparent);border-color:var(--accent, #3b82f6);transform:translateY(-2px)}.month-item:focus,.year-item:focus{outline:2px solid color-mix(in srgb,var(--accent, #3b82f6) 36%,rgba(255,255,255,0));outline-offset:2px}.panel{overflow:hidden;max-height:0;opacity:0;transform:translateY(-6px);transition:max-height .24s ease,opacity .2s ease,transform .2s ease}.panel.is-open{max-height:800px;opacity:1;transform:translateY(0)}.months-panel .months-grid,.years-panel .years-grid{background:color-mix(in srgb,var(--accent, #3b82f6) 4%,transparent);padding:8px;border-radius:6px}.months-panel .month-item,.years-panel .year-item{background:transparent}.month-title.toggle-button.is-open{background:color-mix(in srgb,var(--accent, #3b82f6) 8%,transparent);border-radius:6px}:root[data-theme=dark] .month-grid tr.week-row td{background:color-mix(in srgb,var(--accent, #3b82f6) 6%,rgba(255,255,255,.02))}:root[data-theme=dark] .months-panel .months-grid,:root[data-theme=dark] .years-panel .years-grid{background:color-mix(in srgb,var(--accent, #3b82f6) 8%,rgba(255,255,255,.03))}:root[data-theme=dark] .today-box .box-sub,:root[data-theme=dark] .selected-box .box-sub{color:color-mix(in srgb,var(--accent, #ff6b6b) 76%,#fff 24%);background:color-mix(in srgb,var(--accent, #ff6b6b) 10%,rgba(255,255,255,.03))}