:root {
    --red: #FF3B5C;
    --red-dark: #E11D48;
    --text: #F2F5F7;
    --muted: #A7AEBB;
    --bg: #0E1014;
    --surf: #161A21;
    --surf-2: #1D2330;
    --line: #2A2F3A;
}

.event-calendar.card,
.event-detail.card,
.event-create.card,
.event-form.card,
.event-note.card {
    position: relative;
    background: linear-gradient(182deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .012)) var(--surf);
    border: 1px solid rgba(42, 47, 58, .85);
    border-radius: var(--radius-lg, 18px);
    padding: 24px;
    color: var(--text);
    box-shadow: 0 26px 68px -48px rgba(0, 0, 0, .82);
    overflow: hidden;
}

.event-calendar.card {
    padding: clamp(28px, 2.6vw, 40px);
    border-radius: 22px;
    border-color: rgba(255, 59, 92, .28);
    background: linear-gradient(188deg, rgba(255, 255, 255, .08), rgba(255, 59, 92, .1) 38%, rgba(14, 16, 22, .92)) var(--surf);
    box-shadow: 0 32px 84px -52px rgba(0, 0, 0, .88);
}

.event-calendar.card::after {
    border-color: rgba(255, 59, 92, .35);
}

.event-calendar.card::after,
.event-detail.card::after,
.event-create.card::after,
.event-form.card::after,
.event-note.card::after {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: inherit;
    border: 1px solid rgba(255, 59, 92, .16);
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s ease;
}

.event-calendar.card:hover::after,
.event-calendar.card:focus-within::after,
.event-detail.card:hover::after,
.event-detail.card:focus-within::after,
.event-create.card:hover::after,
.event-create.card:focus-within::after,
.event-form.card:hover::after,
.event-form.card:focus-within::after,
.event-note.card:hover::after,
.event-note.card:focus-within::after {
    opacity: 1;
}

.event-detail {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.event-detail__header {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.event-detail__eyebrow {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
}

.event-detail__badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .32rem .75rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    background: linear-gradient(120deg, rgba(255, 128, 153, .92), rgba(255, 59, 92, .9));
    color: #fff;
    box-shadow: 0 14px 30px -18px rgba(255, 59, 92, .65);
}

.event-detail__status {
    --status-color: rgba(167, 174, 187, .8);
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .28rem .7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .16);
    background: rgba(12, 15, 22, .7);
    color: var(--text);
    font-weight: 600;
    font-size: .7rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    box-shadow: 0 10px 24px -20px rgba(0, 0, 0, .75);
}

.event-detail__status::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--status-color);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, .08);
}

.event-detail__status--upcoming {
    --status-color: #38BDF8;
    background: rgba(56, 189, 248, .18);
    border-color: rgba(56, 189, 248, .32);
    color: #E3F7FF;
}

.event-detail__status--live {
    --status-color: #22C55E;
    background: rgba(34, 197, 94, .22);
    border-color: rgba(34, 197, 94, .38);
    color: #E9FDF2;
}

.event-detail__status--past {
    --status-color: #F97316;
    background: rgba(249, 115, 22, .2);
    border-color: rgba(249, 115, 22, .36);
    color: #FFEDE0;
}

.event-detail__title {
    margin: 0;
    font-size: clamp(1.65rem, 3vw, 2.2rem);
    font-weight: 800;
    letter-spacing: .02em;
    color: var(--text);
    text-shadow: 0 14px 28px rgba(0, 0, 0, .6);
}

.event-detail__subtitle {
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.65;
    max-width: 60ch;
}

.event-detail__subtitle a {
    color: #FF9DB3;
    font-weight: 600;
    text-decoration: none;
}

.event-detail__subtitle a:hover,
.event-detail__subtitle a:focus {
    color: #FFD1DA;
    text-decoration: underline;
}

.event-detail__status-note {
    margin: 0;
    padding: .85rem 1rem;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .08);
    background: rgba(15, 18, 26, .86);
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.6;
}

.event-detail__schedule {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.1rem 1.35rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 59, 92, .22);
    background: linear-gradient(180deg, rgba(255, 59, 92, .18), rgba(12, 15, 22, .92));
    box-shadow: 0 24px 52px -40px rgba(0, 0, 0, .82);
}

.event-detail__schedule-item {
    flex: 1 1 220px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .85rem;
}

.event-detail__icon {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(15, 18, 27, .85);
    color: var(--text);
    box-shadow: 0 12px 26px -22px rgba(255, 59, 92, .55);
}

.event-detail__icon svg {
    display: block;
}

.event-detail__schedule-label {
    display: block;
    font-size: .75rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(242, 245, 247, .65);
    font-weight: 600;
    margin-bottom: .2rem;
}

.event-detail__schedule-value {
    display: block;
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: .01em;
    color: var(--text);
}

.event-detail__info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.event-detail__info-cell {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: 1rem 1.15rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, .06);
    background: rgba(15, 18, 26, .78);
    box-shadow: inset 0 0 0 1px rgba(255, 59, 92, .08);
    min-width: 0;
}

.event-detail__info-label {
    font-size: .75rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(242, 245, 247, .58);
    font-weight: 600;
}

.event-detail__info-value {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--text);
    word-break: break-word;
}

.event-detail__info-link {
    color: #FF9DB3;
    font-weight: 600;
    text-decoration: none;
    transition: color .18s ease;
}

.event-detail__info-link:hover,
.event-detail__info-link:focus {
    color: #FFD1DA;
    text-decoration: underline;
}

.event-detail__section {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.event-detail__section-title {
    margin: 0;
    font-size: .95rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--text);
}

.event-detail__description {
    padding: 1rem 1.15rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, .06);
    background: rgba(14, 18, 26, .82);
}

.event-detail__description p {
    margin-bottom: 0;
}

.event-detail__server-card {
    padding: 1rem 1.15rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, .06);
    background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(12, 15, 22, .9));
    color: var(--muted);
    line-height: 1.65;
}

.event-detail__server-description {
    margin: 0;
}

.event-detail__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.event-detail__action {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem 1.25rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 59, 92, .4);
    background: linear-gradient(180deg, rgba(255, 59, 92, .28), rgba(255, 59, 92, .12));
    color: var(--text);
    font-weight: 600;
    letter-spacing: .02em;
    text-decoration: none;
    box-shadow: 0 16px 32px -28px rgba(255, 59, 92, .58);
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.event-detail__action svg {
    opacity: .88;
}

.event-detail__action:hover,
.event-detail__action:focus {
    background: linear-gradient(180deg, rgba(255, 59, 92, .42), rgba(255, 59, 92, .2));
    border-color: rgba(255, 59, 92, .6);
    color: var(--text);
    transform: translateY(-1px);
    text-decoration: none;
}

.event-detail__action:focus-visible {
    outline: none;
    box-shadow: 0 0 0 .2rem rgba(255, 59, 92, .35);
}

.event-detail__action--secondary {
    border-color: rgba(255, 255, 255, .16);
    background: rgba(14, 18, 26, .82);
    color: var(--muted);
    box-shadow: 0 14px 28px -26px rgba(0, 0, 0, .65);
}

.event-detail__action--secondary:hover,
.event-detail__action--secondary:focus {
    background: rgba(26, 30, 40, .88);
    border-color: rgba(255, 59, 92, .32);
    color: var(--text);
}

.event-calendar__intro {
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    margin-bottom: 24px;
}

.event-calendar__lead {
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.7;
    max-width: 54ch;
}

.event-calendar__grid {
    position: relative;
    min-height: 640px;
}

@media (min-width: 768px) {
    .event-calendar__grid {
        min-height: 940px;
    }
}

@media (min-width: 1200px) {
    .event-calendar__grid {
        min-height: 1040px;
    }
}

.event-calendar__grid.is-hidden {
    display: none;
}

.event-calendar__empty {
    display: flex;
    gap: 16px;
    align-items: center;
    background: linear-gradient(135deg, rgba(255, 255, 255, .035), rgba(255, 59, 92, .08));
    border: 1px dashed rgba(255, 59, 92, .28);
    border-radius: 16px;
    padding: 24px;
    color: var(--muted);
    text-align: left;
    box-shadow: 0 18px 40px -36px rgba(0, 0, 0, .8);
}

.event-calendar__empty.is-hidden {
    display: none;
}

.event-calendar__empty svg {
    width: 40px;
    height: 40px;
    color: var(--muted);
}

.event-calendar__empty h6 {
    margin: 0 0 4px;
    color: var(--text);
    font-weight: 600;
}

.event-calendar__empty p {
    margin: 0;
}

.event-calendar__grid .fc {
    height: auto;
    min-height: inherit;
    background: transparent;
    color: var(--text);
}

.event-calendar__grid .fc-theme-standard td,
.event-calendar__grid .fc-theme-standard th {
    border: none;
}

.event-calendar__grid .fc-scrollgrid,
.event-calendar__grid .fc-scrollgrid table {
    border: none;
    background: transparent;
    border-radius: 18px;
}

.event-calendar__grid .fc-scrollgrid {
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255, 59, 92, .16);
    background: linear-gradient(184deg, rgba(255, 255, 255, .03), rgba(255, 59, 92, .08) 130%);
}

.event-calendar__grid .fc-col-header {
    position: relative;
    background: linear-gradient(180deg, rgba(23, 27, 37, .96), rgba(11, 14, 20, .94));
    border-bottom: 1px solid rgba(255, 59, 92, .32);
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .06), 0 24px 52px -46px rgba(0, 0, 0, .85);
    overflow: hidden;
}


.event-calendar__grid .fc-col-header::before,
.event-calendar__grid .fc-col-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(255, 59, 92, .65), rgba(255, 255, 255, 0));
    opacity: .9;
    pointer-events: none;
}

.event-calendar__grid .fc-col-header table {
    position: relative;
    z-index: 1;
}

.event-calendar__grid .fc-col-header-cell-cushion,
.event-calendar__grid .fc-col-header-cell-cushion:hover,
.event-calendar__grid .fc-col-header-cell-cushion:focus,
.event-calendar__grid .fc-col-header-cell a,
.event-calendar__grid .fc-col-header-cell a:hover,
.event-calendar__grid .fc-col-header-cell a:focus {
    color: #000;
    text-decoration: none;
}

.event-calendar__grid .fc-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.5rem;
    padding: 1.1rem 1.5rem;
    border: 1px solid rgba(255, 59, 92, .24);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(18, 21, 30, .78));
    box-shadow: 0 24px 48px -36px rgba(0, 0, 0, .78);
}

.event-calendar__grid .fc-toolbar-chunk {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.event-calendar__grid .fc-toolbar-title {
    margin: 0;
    font-size: 1.25rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text);
}

.event-calendar__grid .fc-button,
.event-calendar__grid .fc-button-primary {
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, .08);
    background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)) var(--surf-2);
    color: var(--text);
    padding: .45rem .9rem;
    font-weight: 600;
    letter-spacing: .02em;
    transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
    text-transform: none;
}

.event-calendar__grid .fc-button-primary:hover,
.event-calendar__grid .fc-button-primary:focus {
    background: linear-gradient(180deg, rgba(255, 59, 92, .24), rgba(255, 59, 92, .12));
    border-color: rgba(255, 59, 92, .38);
    color: var(--text);
    box-shadow: 0 10px 24px -18px rgba(255, 59, 92, .45);
    transform: translateY(-1px);
}

.event-calendar__grid .fc-button-primary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 .2rem rgba(255, 59, 92, .25);
}

.event-calendar__grid .fc-button-primary:disabled {
    opacity: .6;
}

.event-calendar__grid .fc-col-header-cell {
    position: relative;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: rgba(242, 245, 247, .9);
    font-weight: 600;
    padding: 1rem 0;
    background: linear-gradient(180deg, rgba(255, 59, 92, .24), rgba(255, 59, 92, .12));
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .04);
    text-shadow: 0 16px 32px rgba(0, 0, 0, .58);
}

.event-calendar__grid .fc-col-header-cell.fc-day .fc-col-header-cell-cushion,
.event-calendar__grid .fc-col-header-cell.fc-day .fc-col-header-cell-cushion:hover,
.event-calendar__grid .fc-col-header-cell.fc-day .fc-col-header-cell-cushion:focus {
    color: #000;
}

.event-calendar__grid .fc-col-header-cell a {
    color: inherit;
    text-decoration: none;
}

.event-calendar__grid .fc-col-header-cell::after {
    content: "";
    position: absolute;
    top: 32%;
    bottom: 32%;
    right: 0;
    width: 1px;
    background: rgba(255, 255, 255, .08);
}

.event-calendar__grid .fc-col-header-cell:last-child::after {
    display: none;
}

.event-calendar__grid .fc-col-header-cell-cushion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 0;
    color: #000;
    text-decoration: none;
}

.event-calendar__grid .fc-daygrid-day {
    padding: .35rem;
}

.event-calendar__grid .fc-daygrid-day-frame {
    background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 59, 92, .06) 110%);
    border-radius: 18px;
    border: 1px solid transparent;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
    min-height: 8.25rem;
    padding: .75rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03);
}

@media (min-width: 768px) {
    .event-calendar__grid .fc-daygrid-day-frame {
        min-height: 9rem;
        padding: .85rem;
    }
}

@media (min-width: 1200px) {
    .event-calendar__grid .fc-daygrid-day-frame {
        min-height: 9.75rem;
    }
}

.event-calendar__grid .fc-daygrid-day-frame:hover {
    border-color: rgba(255, 59, 92, .28);
    background: linear-gradient(180deg, rgba(255, 59, 92, .16), rgba(255, 59, 92, .05));
    box-shadow: inset 0 0 0 1px rgba(255, 59, 92, .32);
}

.event-calendar__grid .fc-daygrid-day-number {
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
    font-size: .95rem;
    letter-spacing: .02em;
}

.event-calendar__grid .fc-daygrid-day.fc-day-today .fc-daygrid-day-frame {
    border-color: rgba(255, 59, 92, .45);
    background: rgba(255, 59, 92, .14);
    box-shadow: inset 0 0 0 1px rgba(255, 59, 92, .35);
}

.event-calendar__grid .fc-daygrid-day.fc-day-other .fc-daygrid-day-frame {
    opacity: .45;
}

.event-calendar__grid .fc-daygrid-event {
    background: transparent;
    border: none;
    padding: 0;
}

.event-calendar__grid .fc-daygrid-event .fc-event-main {
    width: 100%;
}

.calendar-event {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    width: 100%;
    padding: .45rem .65rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 59, 92, .12);
    background: rgba(18, 21, 30, .9);
    color: var(--text);
    box-shadow: 0 12px 26px -26px rgba(0, 0, 0, .78);
    transition: background .18s ease, box-shadow .18s ease, border-color .18s ease, transform .18s ease;
}

.calendar-event:hover {
    background: rgba(24, 27, 36, .95);
    border-color: rgba(255, 59, 92, .22);
    box-shadow: 0 16px 32px -28px rgba(255, 59, 92, .28);
    transform: translateY(-1px);
}

.calendar-event:focus-within {
    border-color: rgba(255, 59, 92, .3);
    background: rgba(26, 30, 40, .97);
    box-shadow: 0 18px 36px -28px rgba(255, 59, 92, .32);
}

.calendar-event__meta {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    flex: 1 1 auto;
    min-width: 0;
    text-decoration: none;
    cursor: pointer;
    color: inherit;
}

.calendar-event__meta:focus-visible {
    outline: none;
    box-shadow: 0 0 0 .18rem rgba(255, 59, 92, .35);
    border-radius: 8px;
}

.calendar-event__title {
    font-size: .9rem;
    font-weight: 600;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-event__description {
    font-size: .78rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    word-break: break-word;
}

.calendar-event__date {
    font-size: .72rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.2;
}

.calendar-event__actions {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.calendar-event__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid rgba(255, 59, 92, .35);
    background: linear-gradient(180deg, rgba(255, 59, 92, .28), rgba(255, 59, 92, .14));
    color: var(--text);
    padding: 0;
    cursor: pointer;
    box-shadow: 0 8px 18px -14px rgba(255, 59, 92, .65);
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.calendar-event__action:hover {
    background: linear-gradient(180deg, rgba(255, 59, 92, .38), rgba(255, 59, 92, .22));
    border-color: rgba(255, 59, 92, .55);
    transform: translateY(-1px);
}

.calendar-event__action:focus-visible {
    outline: none;
    box-shadow: 0 0 0 .18rem rgba(255, 59, 92, .45);
    background: linear-gradient(180deg, rgba(255, 59, 92, .42), rgba(255, 59, 92, .26));
}

.calendar-event__action::before {
    font-size: .75rem;
    line-height: 1;
}

.calendar-event__action--edit::before {
    content: "✎";
}

.calendar-event__action--delete::before {
    content: "✕";
}

.event-create__header,
.event-form__header {
    margin-bottom: 16px;
}

.event-create__title,
.event-form__title {
    margin: 0 0 4px;
    font-size: 1.15rem;
    font-weight: 700;
}

.event-create__subtitle,
.event-form__subtitle {
    margin: 0;
    color: var(--muted);
    font-size: .9rem;
}

.event-create__message,
.event-form__message {
    padding: 18px;
    background: rgba(255, 255, 255, .02);
    border: 1px dashed var(--line);
    border-radius: 16px;
    text-align: center;
    color: var(--muted);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.event-create__message p,
.event-form__message p {
    margin: 0;
}

.event-create__trigger {
    font-weight: 700;
}

.event-create-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(8, 10, 15, .72);
    z-index: 1080;
}

.event-create-modal.is-visible {
    display: flex;
}

.event-create-modal__dialog {
    position: relative;
    width: min(560px, 100%);
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
    background: var(--surf);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: 0 24px 64px -32px rgba(0, 0, 0, .85);
}

.event-create-modal__backdrop {
    position: absolute;
    inset: 0;
}

.event-create-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.5rem 1.5rem 1.25rem;
    border-bottom: 1px solid var(--line);
}

.event-create-modal__headline {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.event-create-modal__title {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--text);
}

.event-create-modal__subtitle {
    margin: 0;
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.5;
}

.event-create-modal__close {
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: 1.5rem;
    padding: .25rem .5rem;
    cursor: pointer;
    line-height: 1;
}

.event-create-modal__close:hover,
.event-create-modal__close:focus {
    color: var(--text);
    outline: none;
}

.event-create-modal__body {
    padding: 1.5rem;
}

.event-create-modal__form {
    display: flex;
    flex-direction: column;
}

.event-create-modal__form .form-label {
    font-weight: 600;
    color: var(--text);
}

.event-create-modal__form .form-control,
.event-create-modal__form .form-select {
    background: var(--surf-2);
    border: 1px solid var(--line);
    color: var(--text);
}

.event-create-modal__form .form-control:focus,
.event-create-modal__form .form-select:focus {
    border-color: rgba(255, 59, 92, .45);
    box-shadow: 0 0 0 0.2rem rgba(255, 59, 92, .25);
    outline: none;
}

.event-form__body .form-label {
    font-weight: 600;
    color: var(--text);
}

.event-form__body .form-control,
.event-form__body .form-select {
    background: var(--surf-2);
    border: 1px solid var(--line);
    color: var(--text);
}

.event-form__body .form-control:focus,
.event-form__body .form-select:focus {
    border-color: rgba(255, 59, 92, .45);
    box-shadow: 0 0 0 0.2rem rgba(255, 59, 92, .25);
}

.event-note h6 {
    margin-bottom: 10px;
    font-weight: 700;
}

.event-note ul {
    margin: 0;
    padding-left: 18px;
    color: var(--muted);
    line-height: 1.6;
}

.event-edit-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(8, 10, 15, .72);
    z-index: 1080;
}

.event-edit-modal.is-visible {
    display: flex;
}

.event-edit-modal__dialog {
    position: relative;
    width: min(520px, 100%);
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
    background: var(--surf);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: 0 24px 64px -32px rgba(0, 0, 0, .85);
}

.event-edit-modal__backdrop {
    position: absolute;
    inset: 0;
}

.event-edit-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem 1rem;
    border-bottom: 1px solid var(--line);
}

.event-edit-modal__title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text);
}

.event-edit-modal__close {
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: 1.5rem;
    padding: .25rem .5rem;
    cursor: pointer;
    line-height: 1;
}

.event-edit-modal__close:hover,
.event-edit-modal__close:focus {
    color: var(--text);
    outline: none;
}

.event-edit-modal__form {
    padding: 1.25rem 1.5rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.event-edit-modal__field {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.event-edit-modal__field label {
    font-weight: 600;
    color: var(--text);
}

.event-edit-modal__field input,
.event-edit-modal__field textarea {
    background: var(--surf-2);
    border: 1px solid var(--line);
    border-radius: 12px;
    color: var(--text);
    padding: .6rem .75rem;
}

.event-edit-modal__field input:focus,
.event-edit-modal__field textarea:focus {
    border-color: rgba(255, 59, 92, .45);
    box-shadow: 0 0 0 0.2rem rgba(255, 59, 92, .25);
    outline: none;
}

.event-edit-modal__feedback {
    border-radius: 12px;
    background: rgba(255, 59, 92, .12);
    border: 1px solid rgba(255, 59, 92, .3);
    color: var(--text);
    font-size: .85rem;
    padding: .75rem .9rem;
}

.event-edit-modal__feedback.is-hidden {
    display: none;
}

.event-edit-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
}

.event-edit-modal__btn {
    border-radius: 14px;
    border: 1px solid transparent;
    padding: .55rem 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.event-edit-modal__btn--secondary {
    background: transparent;
    border-color: var(--line);
    color: var(--text);
}

.event-edit-modal__btn--secondary:hover,
.event-edit-modal__btn--secondary:focus {
    background: rgba(255, 255, 255, .06);
    outline: none;
}

.event-edit-modal__btn--primary {
    background: var(--red);
    border-color: var(--red);
    color: #fff;
}

.event-edit-modal__btn--primary:hover,
.event-edit-modal__btn--primary:focus {
    background: var(--red-dark);
    border-color: var(--red-dark);
    outline: none;
}

.event-edit-modal.is-busy .event-edit-modal__btn--primary {
    opacity: .7;
    cursor: progress;
}

.event-delete-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(8, 10, 15, .72);
    z-index: 1080;
}

.event-delete-modal.is-visible {
    display: flex;
}

.event-delete-modal__dialog {
    position: relative;
    width: min(420px, 100%);
    background: var(--surf);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: 0 24px 64px -32px rgba(0, 0, 0, .85);
    padding: 1.75rem 1.5rem 1.5rem;
    overflow: hidden;
}

.event-delete-modal__backdrop {
    position: absolute;
    inset: 0;
}

.event-delete-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.event-delete-modal__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text);
}

.event-delete-modal__close {
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: 1.5rem;
    padding: .25rem .5rem;
    cursor: pointer;
    line-height: 1;
}

.event-delete-modal__close:hover,
.event-delete-modal__close:focus {
    color: var(--text);
    outline: none;
}

.event-delete-modal__body {
    color: var(--muted);
    font-size: .95rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.event-delete-modal__message {
    margin: 0;
}

.event-delete-modal__name {
    color: var(--text);
    font-weight: 600;
}

.event-delete-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
}

.event-delete-modal__btn {
    border-radius: 14px;
    border: 1px solid transparent;
    padding: .55rem 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.event-delete-modal__btn--secondary {
    background: transparent;
    border-color: var(--line);
    color: var(--text);
}

.event-delete-modal__btn--secondary:hover,
.event-delete-modal__btn--secondary:focus {
    background: rgba(255, 255, 255, .06);
    outline: none;
}

.event-delete-modal__btn--danger {
    background: var(--red);
    border-color: var(--red);
    color: #fff;
}

.event-delete-modal__btn--danger:hover,
.event-delete-modal__btn--danger:focus {
    background: var(--red-dark);
    border-color: var(--red-dark);
    outline: none;
}

.event-delete-modal.is-busy .event-delete-modal__btn--danger {
    opacity: .7;
    cursor: progress;
}

@media (max-width: 991.98px) {
    .event-calendar__grid .fc-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .event-calendar__grid .fc-toolbar .fc-toolbar-chunk {
        width: 100%;
        justify-content: space-between;
    }

    .event-calendar__grid .fc-toolbar .fc-button-group,
    .event-calendar__grid .fc-toolbar .fc-button {
        width: 100%;
    }

    .event-calendar__grid .fc-toolbar .fc-button-group .fc-button {
        flex: 1 1 auto;
    }
}

@media (max-width: 767.98px) {
    .event-calendar__grid .fc-daygrid-day-frame {
        min-height: 6.5rem;
        padding: .5rem;
        gap: .35rem;
    }

    .calendar-event {
        padding: .35rem .5rem;
        gap: .55rem;
    }

    .calendar-event__title {
        font-size: .85rem;
    }
}

@media (max-width: 575.98px) {
    .event-calendar.card,
    .event-detail.card,
    .event-create.card,
    .event-form.card,
    .event-note.card {
        padding: 18px;
    }

    .event-detail__schedule {
        padding: 1rem;
    }

    .event-detail__actions {
        flex-direction: column;
    }

    .event-detail__action {
        width: 100%;
        justify-content: center;
    }

    .event-calendar__grid .fc-toolbar-title {
        font-size: 1rem;
    }

    .event-calendar__grid .fc-daygrid-day-frame {
        min-height: 5.75rem;
        padding: .45rem;
    }

    .calendar-event {
        flex-direction: column;
        align-items: flex-start;
        gap: .4rem;
    }

    .calendar-event__actions {
        width: 100%;
        justify-content: flex-start;
    }

    .event-edit-modal,
    .event-create-modal,
    .event-delete-modal {
        padding: 1.25rem;
    }

    .event-edit-modal__dialog,
    .event-create-modal__dialog,
    .event-delete-modal__dialog {
        width: 100%;
        max-height: calc(100vh - 2.5rem);
    }

    .event-create-modal__header {
        flex-direction: column;
        align-items: flex-start;
        gap: .75rem;
    }

    .event-create-modal__close {
        align-self: flex-end;
    }
}

@media (prefers-reduced-motion: reduce) {
    .event-calendar.card::after,
    .event-detail.card::after,
    .event-detail__action,
    .event-create.card::after,
    .event-form.card::after,
    .event-note.card::after,
    .event-calendar__grid .fc-button,
    .calendar-event,
    .calendar-event__action {
        transition: none !important;
    }

    .event-calendar__grid .fc-button-primary:hover,
    .event-calendar__grid .fc-button-primary:focus,
    .calendar-event:hover,
    .calendar-event:focus-within,
    .calendar-event__action:hover,
    .event-detail__action:hover {
        transform: none !important;
        box-shadow: none;
    }
}
