/* Jeongwa's calendar: spacious dates, legible event cards, and a shared day agenda. */
body[data-site-view="calendar"] .add-fab-wrap { display: none; }
.calendar { --cal-blue: #a4d0ff; --cal-border: #344152; width: min(1800px, calc(100% - 64px)); margin: 30px auto 48px; }
.calendar :is(h1,h2,h3,p) { margin: 0; }
.calendar button, .calendar-dialog button { font: inherit; cursor: pointer; }
.calendar :is(button,a):focus-visible, .calendar-dialog :is(button,input,select,textarea):focus-visible { outline: 2px solid #a9d6ff; outline-offset: 4px; }
.calendar :is(button,a) { -webkit-tap-highlight-color: transparent; }
.calendar button:disabled, .calendar-dialog button:disabled { opacity: .4; cursor: default; }
.calendar-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 22px; }
.calendar-eyebrow { color: #8faac7; font-size: 12px; font-weight: 750; letter-spacing: .18em; }
.calendar h1 { margin-top: 4px; font-size: 28px; letter-spacing: -.045em; font-weight: 750; }
.calendar-intro { display: flex; align-items: center; gap: 16px; }
.calendar-heading-mark { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #405873; border-radius: 15px; background: linear-gradient(145deg,#2a415b,#19232f); color: #b9d9fa; }
.calendar-heading-mark svg { width: 27px; height: 27px; }
.calendar-heading-meta { display: flex; align-items: center; gap: 16px; }
.calendar-timezone { color: #8fa0b5; font-size: 13px; letter-spacing: .03em; }
.calendar-primary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 16px; border: 1px solid #a7d3ff; border-radius: 11px; background: #a7d3ff; color: #0b2037; font-size: 13px !important; font-weight: 750 !important; }
.calendar-primary svg { width: 16px; height: 16px; }
.calendar-primary:hover { background: #c0e1ff; }
.calendar-board { min-width: 0; padding: 28px 24px 20px; border: 1px solid #334153; border-radius: 22px; background: linear-gradient(155deg,#1e2937 0,#18212d 48%,#171f2a 100%); box-shadow: 0 10px 32px #00000012; }
.calendar-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 2px 4px 30px; }
.calendar-today-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; justify-self: start; min-height: 48px; padding: 10px 17px; border: 1px solid #4a5a70; border-radius: 999px; color: #dbe9f8; background: #263445; font-size: 14px !important; font-weight: 650 !important; }
.calendar-today-button::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #b6d9ff; }
.calendar-today-button:hover { background: #33465d; }
.calendar-month-nav { display: flex; align-items: center; justify-content: center; gap: 24px; min-width: 0; }
.calendar-month-caption { min-width: 240px; text-align: center; }
.calendar-month-caption > p { color: #8cabc9; font-size: 11px; letter-spacing: .24em; font-weight: 650; margin-bottom: 3px; }
.calendar-month-nav h2 { font-size: 38px; letter-spacing: -.045em; font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.2; }
.calendar-arrow { display: grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; padding: 0; border: 1px solid #45566d; border-radius: 50%; background: #202e3f; color: #c0d7f0; }
.calendar-arrow svg { width: 20px; height: 20px; }
.calendar-arrow:hover { background: #354b66; border-color: #718dab; }
.calendar-modes { display: inline-flex; justify-self: end; align-items: center; gap: 3px; padding: 4px; border: 1px solid #3a495c; border-radius: 12px; background: #121b26; }
.calendar-modes button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; padding: 9px 15px; border: 0; border-radius: 8px; background: transparent; color: #93a6bd; font-size: 14px; font-weight: 650; }
.calendar-modes button svg { width: 16px; height: 16px; }
.calendar-modes button[aria-pressed="true"] { background: #a5cdf5; color: #112c45; box-shadow: 0 2px 5px #0002; }
.calendar-modes button:not([aria-pressed="true"]):hover { background: #26364a; color: #d0e1f4; }
.calendar-weekdays, .calendar-days { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 7px; }
.calendar-weekdays { margin-bottom: 8px; }
.calendar-weekdays > span { display: flex; align-items: center; justify-content: space-between; min-width: 0; padding: 12px 16px; border-radius: 8px; background: #263446; color: #b3c4d8; }
.calendar-weekdays abbr { font-size: 24px; letter-spacing: .1em; font-weight: 750; text-decoration: none; }
.calendar-weekdays i { font-size: 12px; font-style: normal; color: #8fa5bd; }
.calendar-weekdays > span:first-child, .calendar-weekdays > span:first-child i { color: #e3a0af; }
.calendar-weekdays > span:last-child, .calendar-weekdays > span:last-child i { color: #8cbdf2; }
.calendar .calendar-day { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 9px; min-width: 0; min-height: 180px; padding: 12px; border: 1px solid #354355; border-radius: 11px; background: #202b38; color: #dbe6f3; text-align: left; transition: border-color 120ms ease,background 120ms ease; }
.calendar .calendar-day:hover { background: #28394c; border-color: #64809f; }
.calendar .calendar-day[data-selected="true"] { background: #26394f; border-color: #8bbced; box-shadow: inset 0 0 0 1px #8bbced55; }
.calendar .calendar-day.is-other-month { background: #18232f; border-color: #2b394a; color: #71849b; }
.calendar .calendar-day.is-today { border-color: #739fc8; background: linear-gradient(150deg,#2b415a,#213247); }
.calendar .calendar-day.is-today[data-selected="true"] { border-color: #b0d9ff; box-shadow: inset 0 0 0 1px #b0d9ff55; }
.calendar .calendar-day:focus-visible { outline-offset: -4px; }
.calendar-date-line { display: flex; align-items: center; justify-content: space-between; gap: 3px; min-height: 34px; margin-bottom: 3px; }
.calendar-date-number { display: inline-grid; place-items: center; min-width: 34px; height: 34px; font-size: 22px; font-weight: 750; font-variant-numeric: tabular-nums; }
.calendar-day[data-weekday="0"]:not(.is-other-month) .calendar-date-number { color: #eab1bd; }
.calendar-day[data-weekday="6"]:not(.is-other-month) .calendar-date-number { color: #9ac8ff; }
.calendar-day.is-today .calendar-date-number { color: #102c47 !important; background: #b0d6ff; border-radius: 50%; box-shadow: 0 0 0 4px #a4d0ff12; }
.calendar-today-mark { padding: 3px 6px; border-radius: 5px; color: #c0ddff; background: #405f7d; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.calendar-event-chip { --event-fg:#d6eaff; --event-line:#6fa5d3; --event-bg:#304c68; display: flex; flex-direction: column; gap: 7px; flex: 0 0 auto; min-width: 0; padding: 11px 11px 12px; border: 1px solid var(--event-line); border-radius: 7px; background: var(--event-bg); color: var(--event-fg); box-shadow: inset 0 1px 0 #ffffff0a; }
.calendar-event-chip[data-kind="collab"] { --event-fg:#e8ddff; --event-line:#8e76bc; --event-bg:#443659; }
.calendar-event-chip[data-kind="event"] { --event-fg:#f2e5cb; --event-line:#aa8b54; --event-bg:#50442e; }
.calendar-event-chip[data-kind="off"] { --event-fg:#f2d9e3; --event-line:#a3748b; --event-bg:#4c3743; }
.calendar-chip-meta { display: flex; align-items: center; justify-content: space-between; gap: 4px; font-size: 12px; font-weight: 650; }
.calendar-chip-time { align-self: flex-start; padding: 2px 5px; border-radius: 4px; background: #0b192a40; color: inherit; font-variant-numeric: tabular-nums; }
.calendar-chip-kind { font-size: 11px; opacity: .7; font-weight: 500; white-space: nowrap; }
.calendar-chip-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 18px; font-weight: 650; line-height: 1.45; letter-spacing: -.025em; overflow-wrap: anywhere; }
.calendar-chip-note { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 13px; line-height: 1.5; opacity: .7; overflow-wrap: anywhere; font-weight: 400; }
.calendar-day-count { padding: 3px 5px 0; color: #b6cce5; font-size: 12px; font-weight: 500; }
.calendar-day-dots { display: none; }
.calendar-dot, .calendar-legend span::before { content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 5px; background: #81b7ec; border-radius: 50%; }
.calendar-dot[data-kind="collab"], .calendar-legend [data-kind="collab"]::before { background: #b39bdd; }
.calendar-dot[data-kind="event"], .calendar-legend [data-kind="event"]::before { background: #dec17c; }
.calendar-dot[data-kind="off"], .calendar-legend [data-kind="off"]::before { background: #d49eb6; }
.calendar-board-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 3px 0; }
.calendar .calendar-month-summary { color: #91a7c1; font-size: 13px; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: 16px; color: #a7b8cd; font-size: 12px; }
.calendar-legend > span { display: inline-flex; align-items: center; }
.calendar-message { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px 18px; margin-top: 14px; border: 1px solid #4f4a40; border-radius: 12px; background: #2c2923; color: #e8cd9e; font-size: 12px; }
.calendar-message button { min-height: 38px; padding: 6px 12px; border: 1px solid #6d614e; border-radius: 7px; background: #40382d; color: #f0dab6; font-size: 11px; }
.calendar-agenda { display: grid; grid-template-columns: 260px minmax(0,1fr); gap: 32px; align-items: start; margin-top: 18px; padding: 28px 30px; border: 1px solid #354356; border-radius: 18px; background: #1b2532; }
.calendar-agenda-heading { display: flex; gap: 16px; align-items: center; padding-top: 3px; }
.calendar-selected-number { display: grid; place-items: center; flex: 0 0 auto; width: 64px; height: 70px; border: 1px solid #4e6885; border-radius: 13px; color: #b8dbff; background: #293c51; font-size: 34px; line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; }
.calendar-agenda h2 { margin-top: 6px; font-size: 20px; line-height: 1.4; letter-spacing: -.04em; }
.calendar .calendar-selected-count { margin-top: 4px; color: #91a6c0; font-size: 13px; }
.calendar-agenda-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr)); gap: 12px; padding: 0; margin: 0; list-style: none; min-width: 0; }
.calendar-event-detail { --detail-line:#84b7e8; min-width: 0; border: 1px solid #43536a; border-left: 3px solid var(--detail-line); border-radius: 11px; background: #223043; padding: 20px; overflow-wrap: anywhere; }
.calendar-event-detail[data-kind="collab"] { --detail-line:#b19cdd; }
.calendar-event-detail[data-kind="event"] { --detail-line:#dec17c; }
.calendar-event-detail[data-kind="off"] { --detail-line:#d49eb6; }
.calendar-event-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: #b2cce9; font-size: 13px; }
.calendar-event-kind { padding: 2px 7px; border-radius: 5px; background: #31475e; color: var(--detail-line); font-size: 12px; }
.calendar-event-detail h3 { margin: 12px 0 7px; color: #ebf3fd; font-size: 20px; line-height: 1.55; letter-spacing: -.03em; }
.calendar-event-detail p { color: #a7bad2; white-space: pre-wrap; font-size: 14px; line-height: 1.8; }
.calendar-event-detail a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 5px; color: #c1dfff; font-size: 14px; text-underline-offset: 4px; }
.calendar-event-edit { display: block; min-height: 38px; margin-top: 8px; padding: 7px 11px; border: 1px solid #506783; border-radius: 7px; background: #2e435d; color: #c5dcf5; font-size: 13px !important; }
.calendar-empty { grid-column: 1/-1; display: flex; gap: 18px; align-items: center; justify-content: center; min-height: 82px; min-width: 0; padding: 8px 0; color: #9fb2ca; font-size: 15px; line-height: 1.7; }
.calendar-empty-avatar { width: 66px; height: 66px; flex: 0 0 auto; object-fit: cover; border-radius: 50%; border: 1px solid #5d7897; box-shadow: 0 0 0 5px #9cc9ff08; }
.calendar-empty strong { display: block; color: #c5d6ea; font-size: 16px; font-weight: 600; letter-spacing: -.025em; }
.calendar-empty small { display: block; margin-top: 3px; color: #8198b5; font-size: 13px; }
.calendar-weekday-label { display: none; }
.calendar-days[data-mode="week"] .calendar-day { min-height: 400px; }
.calendar-days[data-mode="week"] .calendar-event-chip { position: relative; flex: 0 0 auto; justify-content: flex-start; padding: 36px 12px 18px; gap: 10px; }
.calendar-days[data-mode="week"] .calendar-chip-meta { position: absolute; top: 11px; left: 10px; right: 10px; }
.calendar-days[data-mode="week"] .calendar-chip-title { -webkit-line-clamp: 4; font-size: 18px; line-height: 1.6; text-align: center; }
.calendar-days[data-mode="week"] .calendar-chip-note { -webkit-line-clamp: 3; font-size: 13px; text-align: center; }
.calendar-days[data-mode="week"] .calendar-weekday-label { display: inline-block; margin-left: 3px; color: #9eb0c6; font-size: 12px; font-weight: 400; }
.calendar-days[data-empty="true"][data-mode="week"] .calendar-day { min-height: 360px; }
.calendar-dialog { color-scheme: dark; scrollbar-width: thin; scrollbar-color: #526b87 #1b293a; width: min(540px,calc(100% - 28px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 26px; border: 1px solid #536f8f; border-radius: 20px; background: linear-gradient(150deg,#243448,#192433); color: #e8f1fd; box-shadow: 0 28px 100px #0008; }
.calendar-dialog::backdrop { background: #060f1bc9; backdrop-filter: blur(5px); }
.calendar-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.calendar-dialog-head h2 { margin: 0; font-size: 22px; letter-spacing: -.04em; }
.calendar-dialog-head > button { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid #526a84; border-radius: 50%; color: #bfd5ed; background: #2b3d53; font-size: 22px; }
.calendar-dialog form { display: grid; gap: 17px; margin-top: 24px; }
.calendar-dialog label { display: grid; min-width: 0; gap: 7px; color: #b6c9e0; font-size: 12px; }
.calendar-dialog input, .calendar-dialog select, .calendar-dialog textarea { width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid #4c627b; border-radius: 9px; background: #121e2b; color: #e4edf9; color-scheme: dark; font: inherit; font-size: 16px; }
.calendar-dialog textarea { resize: vertical; }
.calendar-form-row { display: grid; align-items: start; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; }
.calendar-dialog small { color: #7f96b2; font-size: 10px; line-height: 1.7; }
.calendar-dialog .calendar-form-status { font-size: 12px; color: #e8c995; margin: 0; white-space: pre-wrap; }
.calendar-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; padding-top: 4px; }
.calendar-dialog-actions > button { min-height: 44px; padding: 9px 16px; border: 1px solid #566d86; border-radius: 10px; background: #2c3c50; color: #c7d9ed; font-size: 13px; }
.calendar-dialog .calendar-primary { border-color: #a7d3ff; background: #a7d3ff; color: #0b2037; }
.calendar-dialog .calendar-danger { margin-right: auto; color: #e7b5c7; border-color: #715165; background: #493443; }
body[data-site-view="calendar"] .site-view-tabs { width: min(1800px, calc(100% - 64px)); }
.calendar .calendar-primary { min-height:48px; font-size:15px !important; }
@media (max-width:1100px) {
  .calendar, body[data-site-view="calendar"] .site-view-tabs { width: calc(100% - 40px); }
  .calendar-weekdays abbr { font-size:18px; }
  .calendar-weekdays i { font-size:10px; }
  .calendar-month-caption { min-width:190px; }
  .calendar-month-nav { gap:16px; }
  .calendar-month-nav h2 { font-size:32px; }
  .calendar-arrow { width:44px; height:44px; }
  .calendar-chip-title { font-size:15px; }
  .calendar-chip-meta { font-size:10px; }
  .calendar-chip-note { font-size:12px; }
  .calendar-days[data-mode="week"] .calendar-chip-title { font-size:15px; }
  .calendar-days[data-mode="week"] .calendar-chip-note { font-size:12px; }
  .calendar-board { padding: 20px 14px 14px; }
  .calendar-weekdays, .calendar-days { gap: 5px; }
  .calendar .calendar-day { padding: 8px; min-height:140px; }
  .calendar-weekdays > span { padding-inline: 10px; }
  .calendar-chip-kind { display: none; }
  .calendar-today-mark { font-size:8px; padding:3px 4px; }
  .calendar-days[data-mode="week"] .calendar-weekday-label { display:none; }
  .calendar-agenda { grid-template-columns: 210px minmax(0,1fr); gap: 22px; padding: 23px; }
}
@media (max-width:760px) {
  .calendar { width: calc(100% - 28px); margin-top: 22px; }
  body[data-site-view="calendar"] .site-view-tabs { width:calc(100% - 28px); }
  .calendar .calendar-primary { min-height:44px; font-size:13px !important; }
  .calendar-heading { margin-bottom: 17px; }
  .calendar h1 { font-size: 21px; }
  .calendar-heading-mark { width: 40px; height: 40px; border-radius: 12px; }
  .calendar-intro { gap: 12px; }
  .calendar-timezone { display: none; }
  .calendar-month-nav { gap: 10px; }
  .calendar-month-caption { min-width: 156px; }
  .calendar-month-nav h2 { font-size: 24px; }
  .calendar-toolbar { grid-template-columns:1fr 1fr; gap:17px 10px; }
  .calendar-month-nav { grid-row:1; grid-column:1/-1; justify-content:space-between; }
  .calendar-today-button { grid-row:2; }
  .calendar-modes { grid-row:2; }
  .calendar-modes button { padding-inline: 10px; }
  .calendar-modes button svg { display: none; }
  .calendar-today-button { padding-inline: 10px; }
  .calendar-weekdays i { display: none; }
  .calendar-weekdays > span { justify-content: center; }
  .calendar .calendar-day { padding:7px 5px; min-height:110px; }
  .calendar-days[data-mode="month"] .calendar-today-mark { display:none; }
  .calendar-date-number { font-size:18px; min-width:30px; height:30px; }
  .calendar-event-chip { padding: 6px; }
  .calendar-chip-title { font-size:12px; }
  .calendar-chip-note { display: none; }
  .calendar-chip-meta { font-size: 8px; }
  .calendar-agenda { grid-template-columns: minmax(0,1fr); gap: 16px; padding: 20px; }
  .calendar-agenda-heading { padding: 0; }
  .calendar-selected-number { width: 46px; height: 51px; font-size: 24px; border-radius: 10px; }
  .calendar-agenda h2 { font-size: 17px; }
  .calendar-agenda .calendar-eyebrow { font-size: 9px; }
  .calendar-empty { justify-content: flex-start; padding-top: 3px; }
  .calendar[data-mode="week"] .calendar-weekdays { display: none; }
  .calendar-days[data-mode="week"] { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .calendar-days[data-mode="week"] .calendar-day, .calendar-days[data-empty="true"][data-mode="week"] .calendar-day { display: grid; grid-template-columns: 50px minmax(0,1fr); gap: 8px 12px; align-items: start; min-height: 70px; padding: 12px; }
  .calendar-days[data-mode="week"] .calendar-date-line { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; justify-content: flex-start; gap: 4px; margin: 0; }
  .calendar-days[data-mode="week"] .calendar-weekday-label { display: block; margin: 3px 0; font-size: 9px; }
  .calendar-days[data-mode="week"] .calendar-event-chip { grid-column: 2; padding: 11px 12px; }
  .calendar-days[data-mode="week"] .calendar-chip-meta { position:static; font-size:11px; }
  .calendar-days[data-mode="week"] .calendar-chip-kind { display: inline; font-size: 9px; }
  .calendar-days[data-mode="week"] .calendar-chip-title { font-size:15px; -webkit-line-clamp: 3; text-align: left; }
  .calendar-days[data-mode="week"] .calendar-chip-note { display: -webkit-box; font-size:12px; -webkit-line-clamp: 2; text-align: left; }
  .calendar-days[data-mode="week"] .calendar-day-count { grid-column: 2; align-self: center; padding: 4px 0; }
}
@media (max-width:520px) {
  .site-view-tabs { gap: 22px; }
  .calendar-heading-mark { width: 36px; height: 36px; border-radius: 11px; }
  .calendar-heading-mark svg { width: 20px; }
  .calendar h1 { font-size: 19px; }
  .calendar-heading .calendar-eyebrow { font-size: 8px; letter-spacing: .14em; }
  .calendar-heading { gap: 10px; }
  .calendar .calendar-primary, .calendar-dialog .calendar-primary { padding-inline:11px; font-size:11px !important; }
  .calendar-board { padding: 17px 9px 13px; border-radius: 17px; }
  .calendar-toolbar { grid-template-columns: 1fr 1fr; gap: 17px 10px; padding: 0 4px 17px; }
  .calendar-month-nav { grid-row: 1; grid-column: 1/-1; justify-content: space-between; gap: 12px; }
  .calendar-month-nav h2 { font-size: 27px; }
  .calendar-month-caption { min-width: 0; }
  .calendar-month-caption > p { font-size: 8px; }
  .calendar-today-button { grid-row: 2; font-size: 11px !important; min-height: 38px; }
  .calendar-modes { grid-row: 2; padding: 3px; border-radius: 10px; }
  .calendar-modes button { min-height: 32px; padding: 6px 13px; font-size: 11px; }
  .calendar-weekdays, .calendar-days { gap: 4px; }
  .calendar-weekdays { margin-bottom: 6px; }
  .calendar-weekdays > span { padding: 8px 0; border-radius: 6px; }
  .calendar-weekdays abbr { font-size:11px; letter-spacing: .02em; }
  .calendar .calendar-day { min-height:76px; padding:7px 2px; border-radius: 7px; gap: 7px; }
  .calendar-date-line { justify-content:center; min-height:28px; margin-bottom: 0; }
  .calendar-date-number { min-width:26px; height:26px; font-size:13px; }
  .calendar-today-mark { display: none; }
  .calendar-day-dots { display: flex; justify-content: center; flex-wrap: wrap; gap: 3px; }
  .calendar-dot { width: 4px; height: 4px; margin: 0; }
  .calendar-days[data-mode="month"] :is(.calendar-event-chip,.calendar-day-count) { display: none; }
  .calendar-days[data-mode="week"] .calendar-day-dots { display: none; }
  .calendar-days[data-mode="week"] .calendar-date-number { width:34px; height:34px; font-size:18px; }
  .calendar-days[data-mode="week"] .calendar-day { min-height: 64px; }
  .calendar-board-footer { padding-top: 13px; gap: 10px; }
  .calendar .calendar-month-summary { width: 100%; font-size: 10px; }
  .calendar-legend { gap: 13px; font-size: 9px; }
  .calendar-legend span::before { width: 5px; height: 5px; margin-right: 4px; }
  .calendar-agenda { margin-top: 12px; padding: 17px; border-radius: 15px; gap: 15px; }
  .calendar-agenda-heading { gap: 12px; }
  .calendar-agenda h2 { font-size: 16px; }
  .calendar-selected-number { width: 42px; height: 48px; font-size: 22px; }
  .calendar-empty { gap: 13px; min-height: 70px; }
  .calendar-empty-avatar { width: 52px; height: 52px; }
  .calendar-empty strong { font-size: 12px; }
  .calendar-empty small { font-size: 10px; }
  .calendar-message { padding: 12px 14px; font-size: 11px; }
  .calendar-dialog { padding: 21px 18px; border-radius: 17px; }
  .calendar-form-row { grid-template-columns: minmax(0,1fr); }
}
@media (max-width:360px) {
  .calendar-month-nav { gap: 6px; }
  .calendar-month-nav h2 { font-size: 23px; white-space: nowrap; }
  .calendar-arrow { width: 36px; height: 36px; }
}
@media (prefers-reduced-motion:reduce) { .calendar .calendar-day { transition: none; } }

/* Content types and structured event details. */
.calendar [data-kind="singing"] { --event-fg:#e2e6ff; --event-line:#929ee6; --event-bg:#3a4169; --detail-line:#a9b4ff; --kind-dot:#a9b4ff; }
.calendar [data-kind="solo"] { --event-fg:#dcf0e9; --event-line:#73aa9a; --event-bg:#304e49; --detail-line:#9bcdba; --kind-dot:#9bcdba; }
.calendar [data-kind="watch"] { --event-fg:#f4dfe9; --event-line:#b780a1; --event-bg:#533a50; --detail-line:#d6a0bd; --kind-dot:#d6a0bd; }
.calendar [data-kind="game"] { --event-fg:#d9eff9; --event-line:#73abc0; --event-bg:#2e4e60; --detail-line:#91cadd; --kind-dot:#91cadd; }
.calendar [data-kind="ad"] { --event-fg:#f8e9cc; --event-line:#b69858; --event-bg:#53492d; --detail-line:#e2c886; --kind-dot:#e2c886; }
.calendar [data-kind="cover"] { --event-fg:#f8e4db; --event-line:#b58e7a; --event-bg:#544138; --detail-line:#dfb29c; --kind-dot:#dfb29c; }
.calendar [data-kind="relay"] { --event-fg:#d9f0eb; --event-line:#6dada1; --event-bg:#2c4e4c; --detail-line:#8ed0c2; --kind-dot:#8ed0c2; }
.calendar [data-kind="before"] { --event-fg:#e2e8f1; --event-line:#8b9eae; --event-bg:#3b4858; --detail-line:#b1c3d3; --kind-dot:#b1c3d3; }
.calendar-dot, .calendar-legend span::before { background:var(--kind-dot,#81b7ec); }
.calendar-dot[data-kind="collab"], .calendar-legend [data-kind="collab"]::before { background:#b39bdd; }
.calendar-dot[data-kind="event"], .calendar-legend [data-kind="event"]::before { background:#dec17c; }
.calendar-dot[data-kind="off"], .calendar-legend [data-kind="off"]::before { background:#d49eb6; }
.calendar-chip-subtitle { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:1; color:inherit; font-size:14px; line-height:1.5; overflow-wrap:anywhere; font-weight:500; opacity:.9; }
.calendar-chip-members { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:1; color:inherit; font-size:12px; line-height:1.5; overflow-wrap:anywhere; opacity:.75; }
.calendar .calendar-event-subtitle { color:#d1dff1; font-size:17px; line-height:1.65; margin-bottom:10px; }
.calendar .calendar-event-members { color:#b8cce4; font-size:13px; padding:8px 10px; margin:9px 0; border-radius:7px; background:#34485e80; }
.calendar .calendar-event-note { margin-top:10px; }
.calendar-dialog { width:min(620px,calc(100% - 28px)); }
.calendar-content-types { min-width:0; padding:0; margin:0; border:0; }
.calendar-content-types legend { padding:0; margin-bottom:10px; color:#b6c9e0; font-size:12px; }
.calendar-kind-options { display:flex; flex-wrap:wrap; gap:8px; }
.calendar-dialog .calendar-kind-option { position:relative; display:block; cursor:pointer; }
.calendar-dialog .calendar-kind-option input { position:absolute; width:1px; height:1px; min-height:0; padding:0; margin:0; border:0; opacity:0; }
.calendar-kind-option > span { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:7px 13px; border:1px solid #4c627b; border-radius:999px; color:#a9bfd7; background:#1b2a3b; font-size:12px; font-weight:600; line-height:1.5; transition:background 120ms ease,border-color 120ms ease; }
.calendar-kind-option input:checked + span { border-color:#b7dcff; color:#102b44; background:#a7d3ff; box-shadow:0 0 0 1px #a7d3ff33; }
.calendar-kind-option input:focus-visible + span { outline:2px solid #d1e9ff; outline-offset:3px; }
.calendar-kind-option:hover input:not(:disabled):not(:checked) + span { border-color:#8eaccd; color:#dfecfa; background:#2d4259; }
.calendar-kind-option input:disabled + span { opacity:.5; cursor:default; }
.calendar-field-required { color:#a7d3ff; }
@media (max-width:760px) {
  .calendar-chip-subtitle { font-size:12px; }
  .calendar-chip-members { font-size:11px; }
  .calendar-days[data-mode="week"] .calendar-chip-subtitle { font-size:13px; -webkit-line-clamp:2; }
  .calendar-days[data-mode="week"] .calendar-chip-members { font-size:11px; -webkit-line-clamp:2; }
}
@media (max-width:520px) {
  .calendar-kind-options { gap:7px; }
  .calendar-kind-option > span { min-height:38px; padding:7px 11px; font-size:11px; }
}
@media (prefers-reduced-motion:reduce) { .calendar-kind-option > span { transition:none; } }


/* Direct calendar editing, shared clipboard and accessible card actions. */
.calendar-edit-help { max-width:980px; margin:-4px 2px 18px !important; color:#91a9c4; font-size:13px; line-height:1.8; overflow-wrap:anywhere; }
.calendar-clipboard-bar { display:flex; flex-wrap:wrap; align-items:center; gap:9px 14px; min-width:0; margin-bottom:16px; padding:13px 16px; border:1px solid #5d7fa4; border-radius:12px; background:#243a51; color:#d8e9fb; font-size:13px; }
.calendar-clipboard-label { flex:0 0 auto; color:#9ebcda; font-size:11px; }
.calendar-clipboard-bar > strong { flex:1 1 160px; min-width:0; overflow-wrap:anywhere; font-size:13px; font-weight:600; line-height:1.6; }
.calendar-clipboard-actions { display:flex; flex-wrap:wrap; gap:7px; }
.calendar-clipboard-actions button { min-height:44px; padding:8px 12px; border:1px solid #6a88a7; border-radius:8px; background:#35516e; color:#e0efff; font-size:12px; }
.calendar-clipboard-actions button:hover { border-color:#b3d7fc; background:#436384; }
.calendar-clipboard-actions #calendar-clipboard-clear { color:#adc2da; background:transparent; border-color:#526d88; }
.calendar-action-status { padding:12px 16px; margin:0 0 16px !important; border:1px solid #526e89; border-radius:10px; background:#273a4e; color:#c5dcf6; font-size:13px; line-height:1.7; overflow-wrap:anywhere; }
.calendar .calendar-date-line { width:100%; padding:0; border:0; border-radius:5px; background:transparent; color:inherit; text-align:inherit; }
.calendar .calendar-date-line:focus-visible { outline-offset:3px; }
.calendar .calendar-day:has(.calendar-date-line:focus-visible) { border-color:#b5d9ff; }
.calendar .calendar-event-chip { position:relative; width:100%; text-align:left; font:inherit; cursor:pointer; }
.calendar .calendar-event-chip:hover { filter:brightness(1.1); }
.calendar .calendar-event-chip:focus-visible { outline:2px solid #e0efff; outline-offset:3px; }
.calendar .calendar-event-chip[draggable="true"] { cursor:grab; }
.calendar .calendar-event-chip[draggable="true"]:active { cursor:grabbing; }
.calendar .calendar-day-add { position:absolute; z-index:1; top:15px; right:11px; display:grid; place-items:center; width:28px; height:28px; min-width:0; min-height:0; margin:0; padding:0; border:1px solid transparent; border-radius:7px; background:transparent; color:#9fc7ef; font-size:20px; font-weight:400; line-height:1; }
.calendar .calendar-day:has(.calendar-day-add) > .calendar-date-line { width:calc(100% - 36px); }
.calendar .calendar-day-add:focus-visible { outline-offset:1px; }
.calendar-days[data-mode="week"] .calendar-day:has(.calendar-day-add) .calendar-today-mark { display:none; }
.calendar .calendar-day-add:hover { border-color:#6e8eae; color:#e0f0ff; background:#3c5a7899; }
.calendar .calendar-event-actions { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:12px; }
.calendar .calendar-event-actions button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:44px; margin:0; padding:8px 12px; border:1px solid #526b86; border-radius:8px; background:#304962; color:#c8e0fa; font-size:12px; }
.calendar .calendar-event-actions button:hover { border-color:#91b5da; background:#3c5b7b; }
.calendar-context-menu { position:fixed; z-index:2200; display:flex; flex-direction:column; width:270px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto; overscroll-behavior:contain; padding:6px; border:1px solid #6d89a7; border-radius:13px; background:#203044; box-shadow:0 14px 48px #030a1599; color:#e2edfb; }
.calendar-context-menu > button { display:flex; align-items:center; justify-content:space-between; flex:0 0 auto; gap:10px; width:100%; min-height:44px; padding:10px 12px; border:0; border-radius:7px; background:transparent; color:inherit; text-align:left; font-size:13px; line-height:1.5; }
.calendar-context-menu > button:hover, .calendar-context-menu > button:focus-visible { outline:0; background:#3b5673; color:#fff; }
.calendar-context-menu > button:disabled { opacity:.4; background:transparent; cursor:default; }
.calendar-context-menu kbd { flex:0 0 auto; color:#8ca7c3; font:inherit; font-size:10px; }
.calendar-context-menu > .calendar-menu-danger { color:#efb0c5; border-top:1px solid #42536a; border-radius:0 0 7px 7px; margin-top:4px; padding-top:12px; }
.calendar-context-menu > .calendar-menu-danger:hover, .calendar-context-menu > .calendar-menu-danger:focus-visible { color:#ffd3df; background:#573b4b; }
.calendar .is-dragging { opacity:.4; }
.calendar .calendar-day.is-drop-target { border-color:#b6dfff; box-shadow:inset 0 0 0 2px #91c9ff; background:#304a65; }
.calendar .calendar-event-chip.is-drop-before::before, .calendar .calendar-event-chip.is-drop-after::after { content:''; position:absolute; z-index:2; left:-3px; right:-3px; height:3px; border-radius:3px; background:#d0ebff; box-shadow:0 0 0 1px #4e85b6,0 0 8px #a5d6ff66; pointer-events:none; }
.calendar .calendar-event-chip.is-drop-before::before { top:-6px; }
.calendar .calendar-event-chip.is-drop-after::after { bottom:-6px; }
.calendar .calendar-day.is-drop-before { border-top:3px solid #c7e7ff; }
.calendar .calendar-day.is-drop-after { border-bottom:3px solid #c7e7ff; }
@media (max-width:760px) {
  .calendar-edit-help { font-size:11px; margin-bottom:14px !important; }
  .calendar-clipboard-bar { padding:12px; gap:7px 10px; }
  .calendar-clipboard-actions { width:100%; }
  .calendar-clipboard-actions button { flex:1 1 auto; font-size:11px; }
  .calendar-days[data-mode="week"] .calendar-day:has(.calendar-day-add) { padding-top:48px; }
  .calendar-days[data-mode="week"] .calendar-day:has(.calendar-day-add) > .calendar-date-line { width:100%; margin-top:-36px; }
  .calendar-days[data-mode="week"] .calendar-day-add { top:11px; right:11px; }
  .calendar .calendar-event-actions button { min-height:44px; }
}
@media (max-width:520px) {
  .calendar-days[data-mode="month"] .calendar-day:has(.calendar-day-add) { padding-top:28px; }
  .calendar-days[data-mode="month"] .calendar-day:has(.calendar-day-add) > .calendar-date-line { width:100%; }
  .calendar-days[data-mode="month"] .calendar-day-add { top:2px; right:2px; width:24px; height:24px; border-radius:5px; font-size:17px; }
  .calendar-context-menu { width:260px; }
  .calendar-context-menu > button { min-height:44px; }
  .calendar-dialog-actions > #calendar-copy, .calendar-dialog-actions > #calendar-duplicate { padding-inline:12px; }
}

.calendar button.calendar-day-count { min-height:36px; border:1px solid #617d9c; border-radius:7px; background:#314b67; color:#cee5ff; cursor:pointer; }
.calendar button.calendar-day-count:hover { background:#456480; }
.calendar[data-editable="true"] .calendar-day { cursor:pointer; }
.calendar-action-status[data-error="true"] { border-color:#a57b62; color:#f5d2b9; background:#45352e; }

@media (min-width:761px) and (max-width:1100px) {
  .calendar .calendar-day-add { top:11px; right:7px; }
  .calendar .calendar-day:has(.calendar-day-add) .calendar-today-mark { display:none; }
}
@media (min-width:521px) and (max-width:760px) {
  .calendar-days[data-mode="month"] .calendar-day-add { top:8px; right:4px; width:26px; height:26px; }
  .calendar-days[data-mode="month"] .calendar-day:has(.calendar-day-add) > .calendar-date-line { width:calc(100% - 30px); }
}

/* Full details are opened on demand; no selected-day panel below the calendar. */
.calendar-day-details { width:min(760px,calc(100% - 28px)); max-height:calc(100dvh - 32px); overflow-y:auto; margin:auto; padding:24px; border:1px solid #536b87; border-radius:18px; background:#1c2939; color:#e5effb; box-shadow:0 24px 90px #0009; color-scheme:dark; }
.calendar-day-details:not([open]) { display:none; }
.calendar-day-details::backdrop { background:#070e19bd; backdrop-filter:blur(4px); }
.calendar .calendar-details-close { position:absolute; top:16px; right:16px; display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid #536c87; border-radius:50%; background:#2a3e55; color:#cbe2fa; font-size:23px; line-height:1; }
.calendar-day-details .calendar-agenda { display:block; margin:0; padding:0; border:0; border-radius:0; background:none; }
.calendar-day-details .calendar-agenda-heading { padding:0 44px 20px 0; }
.calendar-day-details .calendar-agenda-list { grid-template-columns:minmax(0,1fr); }
.calendar-day-details .calendar-action-status { margin-bottom:14px !important; }
@media(max-width:520px) {
  .calendar-day-details { padding:20px 16px; }
  .calendar-day-details .calendar-event-detail { padding:16px; }
  .calendar-day-details .calendar-agenda-heading { gap:12px; padding-right:38px; }
  .calendar .calendar-details-close { top:14px; right:12px; width:32px; height:32px; }
}