/*
  KYMA primary typeface
  ---------------------
  The supplied webfont is loaded before locally installed copies so every
  visitor receives the same typeface.
*/
@font-face{
  font-family:"THEYellowRibbon";
  src:
    url("assets/THEYellowRibbon.ttf") format("truetype"),
    local("THE노란리본"),
    local("THE노란리본체"),
    local("THENoranribon");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}

:root{
  --kyma-font:"THEYellowRibbon","Jua","Malgun Gothic",sans-serif;
  --kyma-ui-font:Arial,"Noto Sans KR","Malgun Gothic",sans-serif;
}

/* Site-wide visual language */
html,
body,
button,
select,
textarea{
  font-family:var(--kyma-font);
  font-weight:400;
}

/* Existing components that explicitly declared Jua */
.navPill,
.quickLinkLabel,
body:not(.scheduleOpen) .musicDock .compactTrack strong,
body:not(.scheduleOpen) .musicDock .trackCopy strong,
body:not(.scheduleOpen) .musicDock .trackCopy small,
body:not(.scheduleOpen) .musicDrawerToggle,
.weekDayName,
.weekDayEventTitle,
.weekDayState,
.weekToday,
.weekDayBadges b,
.weekScheduleHeading,
.schedulePage,
.scheduleEditorDrawer,
.accountPanel,
.adminShell,
.loginPanel,
.adminFormToggle,
.adminManagerCopy,
.managerEditToggle,
.managerCompactDelete{
  font-family:var(--kyma-font);
  font-weight:400;
}

/* Utility text where Latin/numerals/URLs benefit from a neutral UI face */
input,
.weekDayDate,
.weekDayMeta,
.progressWrap,
.metadataStatus{
  font-family:var(--kyma-ui-font);
}

/* Avoid synthetic bold on the single-weight brand font */
.quickLinkLabel,
.navPill,
body:not(.scheduleOpen) .musicDrawerToggle,
body:not(.scheduleOpen) .musicDock .compactTrack strong,
body:not(.scheduleOpen) .musicDock .trackCopy strong{
  font-weight:400;
}

/* =========================================================
   THEYellowRibbon readability scale v2
   Loaded last so it can safely enlarge small UI text without
   changing any data, JS behavior, grid structure, or DB logic.
   ========================================================= */

/* Header / navigation / account */
.topNav{font-size:17px}
.navPill{
  min-height:42px;
  padding:8px 14px 9px;
  font-size:17px;
  line-height:1;
}
.accountLogin,
.accountLogout,
.accountAdmin{
  min-height:40px;
  padding:7px 11px;
  font-size:16px;
}
.accountName{
  min-height:40px;
  padding:7px 11px;
  font-size:16px;
}

/* Quick links */
.quickLinkLabel{
  font-size:17px;
  line-height:1.25;
}
.quickIconFallback{font-size:15px}

/* Home weekly heading */
.weekScheduleHeading .weekScheduleTitleGroup>span{
  font-size:16px;
  letter-spacing:.16em;
}
.weekScheduleHeading h2{font-size:25px}
.weekScheduleHeading button{
  min-height:36px;
  padding:5px 0;
  font-size:17px;
}

/* Home Sunday-Saturday board */
.weekDayName{font-size:18px}
.weekDayDate{font-size:16px}
.weekToday{
  min-height:25px;
  padding:4px 8px;
  font-size:15px;
}
.weekDayEmpty>span{font-size:20px}
.weekDayEmpty small{font-size:16px}
.weekDayBadges b,
.weekDayState{
  min-height:28px;
  padding:5px 8px;
  font-size:15px;
}
.weekDayEventTitle{
  font-size:18px;
  line-height:1.32;
}
.weekDayMeta{
  font-size:16px;
  line-height:1.4;
}
.weekDayMore{
  min-height:38px;
  padding:8px 7px;
  font-size:15px;
}

/* Home player */
.eyebrow,
.compactTrack span{font-size:15px}
.compactTrack strong{font-size:18px}
.trackCopy strong{font-size:18px}
.trackCopy small{font-size:16px}
.musicDrawerToggle{
  min-height:42px;
  padding:9px 12px;
  font-size:16px;
}
.playlistPanel header span{font-size:15px}
.playlistPanel header strong{font-size:16px}
.playlistItem strong{font-size:16px}
.playlistItem small{font-size:15px}
.playlistItem>a{font-size:15px}
.playlistNow{font-size:15px}
.drawerNote{
  font-size:15px;
  line-height:1.6;
}
.progressWrap{font-size:15px}
.volumeWrap button{font-size:15px}
.youtubeCardCopy small{font-size:15px}
.emptyMessage{font-size:15px}
.heroMeta p{
  font-size:16px;
  line-height:1.45;
}

/* Account modal */
.accountPanel>span{font-size:15px}
.accountPanel>p{font-size:16px;line-height:1.65}
.accountTabs button{font-size:16px}
.accountForm label{font-size:16px}
.accountForm input{font-size:16px}
.accountForm>button{font-size:16px}
.accountError{min-height:22px;font-size:15px;line-height:1.5}
.accountToast{font-size:16px}

/* Schedule page: labels, badges and supporting text */
.scheduleHeading>span,
.sectionLabel>span,
.dateDetail header>span{
  font-size:15px;
  letter-spacing:.16em;
}
.scheduleHeading p{font-size:16px;line-height:1.65}
.sectionLabel h2{font-size:22px}
.dDayBadge,
.typeBadge,
.featuredBadge,
.timeBadge{
  min-height:28px;
  padding:6px 10px;
  font-size:15px;
  line-height:1.15;
}
.eventMeta{font-size:16px}
.eventMembers span{
  padding:6px 9px;
  font-size:15px;
}
.nextEventCopy>p{
  font-size:16px;
  line-height:1.7;
}
.eventLink{
  min-height:38px;
  padding:9px 12px;
  font-size:15px;
}
.scheduleEmpty strong{font-size:16px}
.scheduleEmpty p{font-size:15px;line-height:1.6}
.todayButton{
  min-height:40px;
  padding:9px 14px;
  font-size:15px;
}
.monthControls h2{font-size:24px}
.calendarWeekdays span{
  padding:13px 6px;
  font-size:15px;
}
.dayNumber{
  width:28px;
  height:28px;
  font-size:15px;
}
.calendarEvent{
  padding:6px 7px;
  font-size:15px;
  line-height:1.32;
}
.calendarMore{font-size:15px}
.dateDetail header p{font-size:15px}
.dateDetail header h3{font-size:23px}
.scheduleAddLink{
  min-height:38px;
  padding:9px 11px;
  font-size:15px;
}
.detailEvent h4{font-size:18px}
.detailEvent p{
  font-size:16px;
  line-height:1.65;
}
.scheduleQuickEdit{
  min-height:38px;
  padding:8px 11px;
  font-size:15px;
}
.detailEmpty p{font-size:15px}
.mobileEventMark b{font-size:14px}

/* UPCOMING */
.upcomingCard>.dDayBadge{font-size:15px}
.upcomingDate strong{font-size:16px}
.upcomingDate small{
  font-size:15px;
  line-height:1.4;
}
.upcomingCopy .typeBadge{font-size:15px}
.upcomingCopy h3{font-size:18px}
.upcomingCopy p{
  font-size:15px;
  line-height:1.45;
}
.upcomingActions .featuredBadge{font-size:15px}

/* Admin overview / panel copy */
.backLink{font-size:15px}
.adminIntro>span,
.loginPanel>span{font-size:15px}
.adminIntro p,
.panelHead p,
.loginPanel>p{
  font-size:16px;
  line-height:1.65;
}
.panelHead>span{font-size:15px}
.panelHead h2{font-size:27px}
.logoutButton{
  min-height:42px;
  padding:9px 14px;
  font-size:16px;
}

/* Admin compact management */
.adminCompactHeadCount{
  min-height:28px;
  padding:5px 9px;
  font-size:15px;
}
.adminFormToggle{
  min-height:46px;
  padding:10px 13px;
  font-size:16px;
}
.adminManagerCopy strong{font-size:17px}
.adminManagerCopy small{font-size:15px}
.adminManagerActions a,
.managerEditToggle,
.managerCompactDelete{
  min-height:38px;
  padding:8px 10px;
  font-size:15px;
}

/* Admin forms / rows / playlist / members */
.adminForm label,
.rowField,
.loginForm label,
.scheduleEditorForm>label{font-size:16px}
.adminForm input,
.adminForm select,
.adminForm textarea,
.managerRow input,
.loginForm input,
.scheduleEditorForm input:not([type="checkbox"]),
.scheduleEditorForm select,
.scheduleEditorForm textarea{font-size:16px}
.primaryAction,
.rowSave,
.scheduleEditorActions button,
.scheduleEditorDeleteConfirm button{
  min-height:42px;
  font-size:16px;
}
.formError,
.metadataStatus,
.dataNotice,
.scheduleEditorUploadCopy small,
.scheduleEditorUploadStatus,
.scheduleEditorPreview span,
.scheduleEditorError{
  font-size:15px;
  line-height:1.6;
}
.rowActions a,
.rowDelete,
.musicDelete,
.memberAccessNotice button,
.memberRole select,
.memberRole button,
.scheduleManagerActions button,
.scheduleEditorUploadButton,
.scheduleEditorPreview label,
.scheduleEditorPreview button{font-size:15px}
.rowState,
.musicManagerItem small,
.memberCopy small,
.memberVisits{font-size:15px}
.musicManagerItem strong,
.memberCopy strong{font-size:17px}
.scheduleFallback{font-size:15px}
.scheduleManagerCopy span,
.scheduleManagerCopy b{font-size:15px}
.scheduleManagerCopy strong{font-size:17px}
.scheduleManagerCopy small{font-size:15px}
.scheduleEditorDrawerHead span{font-size:15px}

/* Keep form values / dates / URL-heavy text in the neutral UI face. */
input,
.weekDayDate,
.weekDayMeta,
.progressWrap,
.metadataStatus{
  font-family:var(--kyma-ui-font);
}

/* Tablet: preserve the larger scale while preventing crowding. */
@media(max-width:900px){
  .topNav{font-size:16px}
  .navPill{
    min-height:40px;
    padding:7px 11px 8px;
    font-size:16px;
  }
  .accountLogin,
  .accountLogout,
  .accountAdmin,
  .accountName{
    min-height:38px;
    padding:6px 9px;
    font-size:15px;
  }
  .quickLinkLabel{font-size:16px}
  .weekScheduleHeading .weekScheduleTitleGroup>span{font-size:15px}
  .weekScheduleHeading h2{font-size:24px}
  .weekScheduleHeading button{font-size:16px}
  .musicDrawerToggle{font-size:16px}
}

/* Mobile: readable, but slightly tighter to avoid horizontal overflow. */
@media(max-width:560px){
  .topNav{gap:6px;font-size:15px}
  .navPill{
    min-width:56px;
    min-height:38px;
    padding:6px 9px 7px;
    font-size:15px;
  }
  .accountArea{gap:6px}
  .accountLogin,
  .accountLogout,
  .accountAdmin,
  .accountName{
    min-height:36px;
    padding:6px 8px;
    font-size:15px;
  }
  .accountName{max-width:104px}
  .quickLinkLabel{font-size:16px}
  .weekScheduleHeading .weekScheduleTitleGroup>span{font-size:15px}
  .weekScheduleHeading h2{font-size:23px}
  .weekScheduleHeading button{font-size:16px}
  .weekDayName{font-size:17px}
  .weekDayDate{font-size:16px}
  .weekDayEmpty small{font-size:15px}
  .weekDayEventTitle{font-size:17px}
  .weekDayMeta{font-size:15px}
  .musicDrawerToggle{font-size:15px}
  .compactTrack strong{font-size:17px}
  .trackCopy strong{font-size:18px}
  .trackCopy small{font-size:15px}
  .calendarWeekdays span{font-size:15px}
  .dayNumber{font-size:15px}
  .adminManagerActions{padding-left:62px}
  .adminManagerActions a,
  .managerEditToggle,
  .managerCompactDelete{font-size:15px}
}

/* =========================================================
   THEYellowRibbon readability scale v3
   Second readability pass: small/supporting UI only.
   ========================================================= */

/* made in 수제비: explicit brand font + stronger presence */
.heroMaGroup .heroMeta p,
.heroMeta p{
  font-family:var(--kyma-font);
  font-weight:400;
  font-size:18px;
  line-height:1.35;
}

/* Header */
.topNav{font-size:18px}
.navPill{
  min-height:43px;
  padding:8px 12px 9px;
  font-size:18px;
}
.accountLogin,
.accountLogout,
.accountAdmin,
.accountName{
  min-height:41px;
  padding:7px 10px;
  font-size:17px;
}

/* Quick links */
.quickLinkLabel{
  font-family:var(--kyma-font);
  font-weight:400;
  font-size:20px;
  line-height:1.18;
}

/* Weekly heading */
.weekScheduleHeading .weekScheduleTitleGroup>span{font-size:17px}
.weekScheduleHeading button{
  min-height:38px;
  font-size:18px;
}

/* Weekly board supporting type */
.weekDayName{font-size:19px}
.weekDayDate{font-size:17px}
.weekToday{font-size:16px}
.weekDayEmpty small{font-size:17px}
.weekDayBadges b,
.weekDayState{font-size:16px}
.weekDayMeta{font-size:17px}
.weekDayMore{font-size:16px}

/* Music player */
.eyebrow,
.compactTrack span{font-size:16px}
.compactTrack strong{font-size:19px}
.trackCopy strong{font-size:19px}
.trackCopy small{font-size:17px}
.musicDrawerToggle{
  min-height:43px;
  padding:9px 11px;
  font-size:17px;
}
.playlistPanel header span{font-size:16px}
.playlistPanel header strong{font-size:17px}
.playlistItem strong{font-size:17px}
.playlistItem small{font-size:16px}
.playlistItem>a{font-size:16px}
.playlistNow{font-size:16px}
.drawerNote{font-size:16px}
.progressWrap{font-size:16px}
.volumeWrap button{font-size:16px}

/* Schedule page: +1px on supporting information */
.scheduleHeading>span,
.sectionLabel>span,
.dateDetail header>span{font-size:16px}
.scheduleHeading p{font-size:17px}
.dDayBadge,
.typeBadge,
.featuredBadge,
.timeBadge{font-size:16px}
.eventMeta{font-size:17px}
.eventMembers span{font-size:16px}
.nextEventCopy>p{font-size:17px}
.eventLink{font-size:16px}
.scheduleEmpty p{font-size:16px}
.todayButton{font-size:16px}
.calendarWeekdays span{font-size:16px}
.dayNumber{font-size:16px}
.calendarEvent{font-size:16px}
.calendarMore{font-size:16px}
.dateDetail header p{font-size:16px}
.scheduleAddLink{font-size:16px}
.detailEvent p{font-size:17px}
.scheduleQuickEdit{font-size:16px}
.detailEmpty p{font-size:16px}
.upcomingCard>.dDayBadge{font-size:16px}
.upcomingDate small{font-size:16px}
.upcomingCopy .typeBadge{font-size:16px}
.upcomingCopy p{font-size:16px}
.upcomingActions .featuredBadge{font-size:16px}

/* Admin: small copy/actions +1px */
.backLink{font-size:16px}
.adminIntro>span,
.loginPanel>span{font-size:16px}
.adminIntro p,
.panelHead p,
.loginPanel>p{font-size:17px}
.panelHead>span{font-size:16px}
.adminCompactHeadCount{font-size:16px}
.adminFormToggle{font-size:17px}
.adminManagerCopy small{font-size:16px}
.adminManagerActions a,
.managerEditToggle,
.managerCompactDelete{font-size:16px}
.formError,
.metadataStatus,
.dataNotice,
.scheduleEditorUploadCopy small,
.scheduleEditorUploadStatus,
.scheduleEditorPreview span,
.scheduleEditorError{font-size:16px}
.rowActions a,
.rowDelete,
.musicDelete,
.memberAccessNotice button,
.memberRole select,
.memberRole button,
.scheduleManagerActions button,
.scheduleEditorUploadButton,
.scheduleEditorPreview label,
.scheduleEditorPreview button{font-size:16px}
.rowState,
.musicManagerItem small,
.memberCopy small,
.memberVisits{font-size:16px}
.scheduleFallback{font-size:16px}
.scheduleManagerCopy span,
.scheduleManagerCopy b,
.scheduleManagerCopy small{font-size:16px}
.scheduleEditorDrawerHead span{font-size:16px}

/* Give the desktop player a little more breathing room instead of shrinking text. */
@media(min-width:901px){
  body:not(.scheduleOpen) .musicDock{
    width:400px;
    padding:17px;
  }
}

/* Tablet */
@media(max-width:900px){
  .topNav{font-size:17px}
  .navPill{
    min-height:41px;
    padding:7px 10px 8px;
    font-size:17px;
  }
  .accountLogin,
  .accountLogout,
  .accountAdmin,
  .accountName{font-size:16px}
  .quickLinkLabel{font-size:18px}
  .weekScheduleHeading .weekScheduleTitleGroup>span{font-size:16px}
  .weekScheduleHeading button{font-size:17px}
  .musicDrawerToggle{font-size:16px}
}

/* Mobile */
@media(max-width:560px){
  .topNav{gap:5px;font-size:16px}
  .navPill{
    min-width:54px;
    min-height:39px;
    padding:6px 8px 7px;
    font-size:16px;
  }
  .accountArea{gap:5px}
  .accountLogin,
  .accountLogout,
  .accountAdmin,
  .accountName{
    min-height:37px;
    padding:6px 7px;
    font-size:16px;
  }
  .accountName{max-width:100px}
  .quickLinkLabel{font-size:17px}
  .weekScheduleHeading .weekScheduleTitleGroup>span{font-size:16px}
  .weekScheduleHeading button{font-size:17px}
  .weekDayName{font-size:18px}
  .weekDayDate{font-size:17px}
  .weekDayEmpty small{font-size:16px}
  .weekDayMeta{font-size:16px}
  .musicDrawerToggle{font-size:16px}
  .compactTrack strong{font-size:18px}
  .trackCopy strong{font-size:19px}
  .trackCopy small{font-size:16px}
}

/* YouTube viewport safety: global so tablet/mobile cannot collapse below 200px. */
.playerMount{
  min-height:202px;
}

/* Home weekly date/meta stay on the KYMA brand font. */
.weekDayDate,
.weekDayMeta{
  font-family:var(--kyma-font);
}
