.analysis-period-head .period-title-trigger { display: inline-flex; gap: 8px; width: auto; height: auto; min-height: 44px; padding: 6px 0; color: var(--ink); background: transparent; font: inherit; font-size: 24px; font-weight: 700; letter-spacing: .02em; text-align: left; line-height: 1.3; }
.period-title-trigger:not(:disabled)::after { content: '⌄'; color: var(--muted); font-size: 20px; }
.period-title-trigger:disabled { opacity: 1; cursor: default; }
.period-title-trigger:focus-visible, .period-picker button:focus-visible { outline: 2px solid #60a5fa; outline-offset: 3px; }
.period-picker { box-sizing: border-box; width: min(360px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow: auto; padding: 20px; border: 1px solid #35434d; border-radius: 20px; color: var(--ink, #eef5f2); background: var(--surface, #101923); box-shadow: 0 20px 80px #0008; }
.period-picker::backdrop { background: #0009; }
.period-picker header, .picker-year-nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.period-picker h2 { margin: 0; font-size: 20px; }
.period-picker button { min-height: 44px; border: 1px solid #35434d; border-radius: 10px; color: inherit; background: var(--surface-3, #1c2a35); cursor: pointer; font: inherit; }
.period-picker button:disabled { opacity: .35; cursor: default; }
.period-picker .picker-close { border: 0; background: transparent; font-size: 26px; width: 44px; }
.picker-content { margin-top: 18px; }
.picker-year-nav > button { width: 44px; font-size: 25px; }
.period-picker label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
.period-picker input { box-sizing: border-box; min-width: 0; width: 100%; min-height: 44px; padding: 8px; border: 1px solid #52616e; border-radius: 8px; background: var(--surface); color: var(--ink); color-scheme: dark; font: inherit; font-size: 16px; }
.picker-year-nav label { width: 120px; }
.picker-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 16px; }
.picker-grid [aria-pressed="true"] { color: #08251b; background: #69e6b7; border-color: #69e6b7; font-weight: 700; }
.picker-range { text-align: center; color: var(--muted); font-size: 13px; margin: 12px 0 0; }
.picker-apply { width: 100%; margin-top: 18px; }
