.anniversary-screen { overflow-y: auto; padding: 34px 0 26px 30px; }
.anniversary-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.anniversary-header p { margin: 8px 0 5px; color: #6686a2; font-size: 12px; font-weight: 700; }
.anniversary-header h1 { margin: 0; color: #18324f; font-size: 28px; letter-spacing: -.6px; }
.anniversary-new-button { border: 1px solid #9bc8ea; border-radius: 14px; padding: 12px 16px; color: #176eae; background: #eef8ff; font: inherit; font-weight: 800; cursor: pointer; }
.anniversary-copy { margin: 12px 0 22px; color: #7597b2; }
.anniversary-list { display: grid; gap: 12px; }
.anniversary-card, .anniversary-empty { border: 1px solid #cde5f7; border-radius: 18px; background: #fbfdff; }
.anniversary-card { display: flex; align-items: center; gap: 14px; padding: 17px 18px; box-shadow: 0 6px 18px rgba(72, 132, 175, .08); }
.anniversary-card strong { display: block; color: #214c6e; font-size: 17px; }
.anniversary-card small { display: block; margin-top: 5px; color: #5f89aa; font-size: 14px; }
.anniversary-mark { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 12px; color: #b05b91; background: #fff0f7; font-size: 20px; }
.anniversary-empty { padding: 42px 20px; color: #7c9ab2; text-align: center; border-style: dashed; }
.anniversary-dialog { width: min(430px, calc(100vw - 32px)); border: 0; border-radius: 22px; padding: 0; color: #1f4a6a; box-shadow: 0 22px 56px rgba(24, 66, 98, .28); }
.anniversary-dialog::backdrop { background: rgba(28, 62, 88, .46); backdrop-filter: blur(2px); }
.anniversary-dialog form { padding: 26px; }
.anniversary-dialog label { display: grid; gap: 8px; font-weight: 800; color: #416d90; }
.anniversary-dialog input { min-height: 48px; border: 1px solid #bcdcf3; border-radius: 11px; padding: 0 13px; color: #234b6c; background: #f7fbff; font: inherit; }
.anniversary-date-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.anniversary-date-field { position: relative; display: grid; gap: 8px; color: #416d90; font-size: 13px; font-weight: 800; }
.anniversary-date-trigger { display:flex; align-items:center; justify-content:space-between; min-height:48px; width:100%; border:1px solid #bcdcf3; border-radius:11px; background:#f7fbff; color:#234b6c; padding:0 13px; font:inherit; font-weight:700; cursor:pointer; }
.anniversary-date-trigger:hover, .anniversary-date-trigger[aria-expanded="true"] { border-color:#76b7df; background:#eef9ff; }
.anniversary-date-trigger i { display:grid; place-items:center; width:20px; height:20px; flex:0 0 20px; }
.anniversary-date-trigger i::before { content:""; width:7px; height:7px; border-right:2px solid #4d8dba; border-bottom:2px solid #4d8dba; transform:translateY(-2px) rotate(45deg); transition:transform .16s ease; }
.anniversary-date-trigger[aria-expanded="true"] i::before { transform:translateY(2px) rotate(225deg); }
.anniversary-date-list { position:absolute; z-index:8; top:calc(100% + 6px); left:0; right:0; display:grid; grid-template-columns:1fr; gap:4px; max-height:148px; overflow-y:auto; border:1px solid #b7d9eb; border-radius:11px; background:#fff; box-shadow:0 14px 28px rgba(29,83,121,.2); padding:6px; }
.anniversary-date-list.is-hidden { display:none; }
.anniversary-date-option { min-height:33px; border:0; border-radius:7px; background:transparent; color:#426d8e; font:inherit; font-size:12px; font-weight:750; cursor:pointer; }
.anniversary-date-option:hover, .anniversary-date-option:focus-visible { background:#e5f5ff; color:#176eae; outline:0; }
.anniversary-form-copy { margin: 16px 0 4px; border-left: 3px solid #78c8ed; padding: 10px 12px; color: #5f88a8; background: #eff9ff; font-size: 14px; line-height: 1.5; }
.calendar-anniversary { display: block; overflow: hidden; color: #ad568e; font-size: 11px; font-weight: 800; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 540px) { .tabbar { gap: 16px; } .tab { min-width: 0; } .anniversary-screen { padding-left: 20px; } .anniversary-dialog form { padding: 20px; } }