.date-picker-button{width:100%;min-height:34px;text-align:left;font-size:inherit;font-variant-numeric:tabular-nums;background:var(--soft,#f4f6f5);color:var(--ink,#263632);border:1px solid var(--line,#dce3df);border-radius:5px;padding:7px 10px;cursor:pointer}
.date-calendar{width:min(316px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;box-sizing:border-box;border:1px solid var(--line,#dce3df);border-radius:10px;padding:16px;background:var(--panel,#fff);color:var(--ink,#263632);font:14px 'Segoe UI',sans-serif}
.date-calendar::backdrop{background:#12251d65}
.date-calendar-heading{display:grid;grid-template-columns:32px minmax(0,1fr) 32px;gap:5px;margin-bottom:10px}
.date-calendar button{box-sizing:border-box;font:inherit;color:inherit;border:1px solid transparent;background:transparent;cursor:pointer;border-radius:5px;padding:5px;min-height:32px;min-width:0}
.date-calendar button:hover,.date-calendar button:focus-visible{background:var(--soft,#f0f4f2);outline:2px solid var(--accent,#326b63);outline-offset:-2px}
.date-calendar button:disabled{opacity:.3;cursor:default}
.date-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.date-calendar-grid button[aria-pressed=true]{background:var(--accent,#326b63);color:var(--panel,#fff)}
.date-calendar-grid button[aria-current=date]{border-color:var(--accent,#326b63)}
.date-weekday{text-align:center;font-size:11px;color:var(--muted,#69776f);padding:5px 0}
.date-period-grid{grid-template-columns:repeat(3,minmax(0,1fr));min-height:210px}
.date-period-grid button{font-size:12px}
.date-calendar-footer{display:flex;justify-content:space-between;gap:6px;border-top:1px solid var(--line,#dce3df);margin-top:12px;padding-top:10px}
.date-calendar-footer button{font-size:12px}