/* Danmi v39 — consolidated layout stylesheet
   Original cascade order preserved exactly.
   Visual behavior is intentionally unchanged. */


/* ===== 1. original mobile-final-polish.css ===== */

/* DANMI 모바일 전체 화면 최종 보정 */
@media (max-width: 760px) {
  html, body { overflow-x: hidden; }

  .main-content,
  .content-area,
  .dashboard,
  .dashboard-grid,
  .card,
  .full-view-panel,
  .full-view-body { min-width: 0; max-width: 100%; }

  .card { padding: 16px; border-radius: 20px; }
  .card-header { gap: 10px; align-items: center; }
  .card-header h2 { min-width: 0; line-height: 1.25; }
  .card-header > button,
  [data-full-view] { min-height: 38px; padding: 7px 11px; white-space: nowrap; }

  /* 방송 일정 */
  .schedule-list { gap: 9px; }
  .schedule-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 9px;
    align-items: center;
    min-height: 58px;
    padding: 10px 11px;
  }
  .schedule-item > * { min-width: 0; }
  .schedule-item .schedule-info,
  .schedule-item .schedule-content { overflow: hidden; }
  .schedule-item .schedule-title,
  .schedule-item .schedule-description { overflow-wrap: anywhere; }
  .schedule-type { max-width: 76px; white-space: nowrap; }

  /* 노래 숙제 */
  .homework-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .homework-tabs button { min-width: 0; min-height: 42px; }
  .homework-summary { padding: 12px; }
  .homework-item {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px;
    align-items: center;
  }
  .homework-item > * { min-width: 0; }
  .homework-item button { min-height: 38px; }

  /* 공지사항 */
  .notice-list,
  .notice-card-list { gap: 9px; }
  .notice-item,
  .notice-list-item {
    padding: 12px;
    min-width: 0;
  }
  .notice-item-title,
  .notice-title,
  .notice-item-content { overflow-wrap: anywhere; }

  /* 전체보기 공통 */
  .full-view-overlay { padding: 0; align-items: stretch; }
  .full-view-panel {
    width: 100%;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
  }
  .full-view-header {
    position: sticky;
    top: 0;
    z-index: 5;
    padding: calc(14px + env(safe-area-inset-top)) 16px 13px;
  }
  .full-view-header > div { min-width: 0; }
  .full-view-header h2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .full-view-close { flex: 0 0 auto; min-width: 42px; min-height: 42px; }
  .full-view-body {
    padding: 14px 12px calc(94px + env(safe-area-inset-bottom));
    overflow-x: hidden;
  }

  /* 검색/필터 컨트롤 */
  .songbook-controls,
  .full-songbook-controls,
  .filter-toolbar,
  .search-toolbar { gap: 8px; }
  .songbook-controls input,
  .full-songbook-controls input,
  .filter-toolbar input,
  .search-toolbar input { width: 100%; min-width: 0; min-height: 44px; }
  select, input, textarea, button { font-size: max(16px, 1em); }

  /* 모바일 하단 메뉴와 콘텐츠 충돌 방지 */
  .main-content,
  main { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  .mobile-bottom-nav { padding-bottom: env(safe-area-inset-bottom); }
  .mobile-nav-button { min-width: 0; }
  .mobile-nav-button span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (max-width: 390px) {
  .card { padding: 13px; border-radius: 18px; }
  .schedule-item { grid-template-columns: 38px minmax(0, 1fr); }
  .schedule-item .schedule-type { grid-column: 2; justify-self: start; }
  .full-view-body { padding-left: 10px; padding-right: 10px; }
}



/* ===== 2. original ui-layout-repair-v5.css ===== */

/* Danmi UI layout repair v5 — requested alignment and mobile schedule fixes */

/* 1) Remove all decorative playing-card suit marks and white title plates */
.schedule-card::before,.schedule-card::after,
.songbook-card::before,.songbook-card::after,
.homework-card::before,.homework-card::after,
.notice-card::before,.notice-card::after,
.content-card::before,.content-card::after,
.route-schedule-week::before,.route-schedule-week::after,
.route-songbook-panel::before,.route-songbook-panel::after,
.route-homework-panel::before,.route-homework-panel::after,
.songbook-notice-panel::before,.songbook-notice-panel::after,
.notice-item::before,.notice-item::after,
.card-header h2::before,.card-header h2::after,
.schedule-card .card-header h2::before,.schedule-card .card-header h2::after,
.songbook-card .card-header h2::before,.songbook-card .card-header h2::after,
.homework-card .card-header h2::before,.homework-card .card-header h2::after {
  content: none !important;
  display: none !important;
}
.card-header,.card-header h2,.songbook-heading-group,.songbook-heading-group h2,
.route-page-header,.route-page-header h2,.full-view-header,.full-view-header h2 {
  background: transparent !important;
  box-shadow: none !important;
}
.card-header h2,.songbook-heading-group h2 { padding: 0 !important; border: 0 !important; }

/* 2) Home schedule badges: text vertically centered and kept inside pill */
#scheduleSection .schedule-type {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 28px !important;
  height: 28px !important;
  padding: 2px 10px 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}
#scheduleSection .schedule-item > strong,
#scheduleSection .schedule-item > span { align-self: center !important; }

/* 3) Full-page toolbars/tabs: controls sit slightly lower, without covering content */
.route-week-head,
.route-toolbar,
.route-homework-tabs {
  position: relative !important;
  top: auto !important;
  margin-top: 7px !important;
  margin-bottom: 16px !important;
  transform: translateY(3px) !important;
  z-index: 3 !important;
}
.route-week-head > button,
.route-toolbar > button,
.route-toolbar input,
.route-view-toggle,
.route-homework-tabs > button {
  position: relative !important;
  top: 2px !important;
}

/* 4) Notice full page alignment */
.route-notice-list {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}
.route-notice-item { width: 100% !important; margin: 0 !important; overflow: hidden !important; }
.route-notice-summary {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: 12px 16px !important;
  text-align: left !important;
}
.route-notice-summary strong { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.route-notice-content { padding: 0 16px 16px !important; line-height: 1.75 !important; overflow-wrap: anywhere !important; }

/* 5) Songbook sticky header: opaque and naturally below page header */
.route-song-table { position: relative !important; isolation: isolate !important; }
.route-song-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  background: var(--ui-surface-strong, #fffefe) !important;
  border: 1px solid var(--ui-line, #e5d9ef) !important;
  box-shadow: 0 8px 14px color-mix(in srgb, var(--ui-bg, #fff) 88%, transparent) !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html[data-theme="dark"] .route-song-header,
body.dark-mode .route-song-header { background: var(--ui-surface-strong, #2a2235) !important; }
.route-song-header::before {
  content: "" !important;
  position: absolute !important;
  inset: -10px 0 auto !important;
  height: 10px !important;
  background: var(--ui-bg, #fff) !important;
  pointer-events: none !important;
}

/* 6) Mobile home schedule: stable, readable 3-column rows */
@media (max-width: 760px) {
  #scheduleSection { min-width: 0 !important; overflow: hidden !important; }
  #scheduleSection .card-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
  }
  #scheduleSection .card-header h2 { min-width: 0 !important; font-size: 1.08rem !important; }
  #scheduleSection .schedule-list { display: grid !important; gap: 8px !important; }
  #scheduleSection .schedule-item {
    display: grid !important;
    grid-template-columns: 34px 58px minmax(0,1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 52px !important;
    padding: 9px 10px !important;
    overflow: hidden !important;
  }
  #scheduleSection .schedule-item > strong {
    grid-column: 1 !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: var(--ui-soft, #f4eefb) !important;
  }
  #scheduleSection .schedule-type {
    grid-column: 2 !important;
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    height: 27px !important;
    min-height: 27px !important;
    padding: 2px 5px 0 !important;
    font-size: .87rem !important;
  }
  #scheduleSection .schedule-item > span:last-child {
    grid-column: 3 !important;
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    line-height: 1.35 !important;
  }

  .route-week-head { display: grid !important; grid-template-columns: auto minmax(0,1fr) auto !important; align-items: center !important; gap: 7px !important; }
  .route-week-head > button { min-height: 40px !important; padding: 8px 10px !important; font-size: .9rem !important; }
  .route-week-title { min-width: 0 !important; text-align: center !important; }

  .route-toolbar { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .route-toolbar > input { grid-column: 1 / -1 !important; width: 100% !important; }
  .route-toolbar > #routeFavoriteOnly { grid-column: 1 !important; min-width: 0 !important; }
  .route-toolbar > .route-view-toggle { grid-column: 2 !important; min-width: 0 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; }
  .route-view-toggle button { min-width: 0 !important; padding-inline: 7px !important; white-space: nowrap !important; }

  .route-homework-tabs { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .route-homework-tabs > button { min-height: 42px !important; }

  .route-notice-summary { grid-template-columns: auto minmax(0,1fr) auto !important; gap: 8px !important; padding: 11px 12px !important; }
  .route-notice-summary time { grid-column: 2 !important; font-size: .82rem !important; }
  .route-notice-summary .notice-chevron { grid-column: 3 !important; grid-row: 1 / span 2 !important; }
}

@media (max-width: 380px) {
  #scheduleSection .schedule-item { grid-template-columns: 30px 52px minmax(0,1fr) !important; gap: 6px !important; padding-inline: 8px !important; }
  #scheduleSection .schedule-type { width: 52px !important; min-width: 52px !important; max-width: 52px !important; font-size: .82rem !important; }
}



/* ===== 3. original layout-polish-v20.css ===== */

/* Danmi layout polish v20 */

/* Home songbook preview — cleaner rounded cards and spacing */
#songbookSection .song-table-header {
  margin: 0 0 10px !important;
  padding: 10px 12px !important;
  border-radius: 16px !important;
  align-items: center !important;
}
#songbookSection #songRows {
  display: grid !important;
  gap: 10px !important;
}
#songbookSection #songRows .song-row {
  margin: 0 !important;
  padding: 11px 12px !important;
  border-radius: 16px !important;
  min-height: 72px !important;
  align-items: center !important;
}
#songbookSection #songRows .song-info {
  min-width: 0 !important;
}
#songbookSection #songRows .song-info strong {
  display: block !important;
  margin-bottom: 3px !important;
  line-height: 1.25 !important;
}
#songbookSection #songRows .song-info span {
  display: block !important;
  line-height: 1.25 !important;
}
#songbookSection #songRows .genre,
#songbookSection #songRows .difficulty,
#songbookSection #songRows .song-status {
  min-height: 30px !important;
  border-radius: 999px !important;
}

/* Full-view common rhythm */
.route-page-body {
  padding-top: 14px !important;
}
.route-toolbar,
.route-homework-tabs,
.route-week-head {
  margin-top: 4px !important;
  margin-bottom: 14px !important;
  transform: none !important;
}
.route-toolbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  gap: 10px !important;
  align-items: center !important;
}
.route-toolbar input {
  min-width: 0 !important;
  min-height: 44px !important;
  border-radius: 14px !important;
}
.route-toolbar > button,
.route-view-toggle,
.route-homework-tabs > button,
.route-week-head > button {
  min-height: 42px !important;
  border-radius: 14px !important;
}
.route-view-toggle {
  display: inline-grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 6px !important;
  padding: 4px !important;
}
.route-view-toggle button {
  min-height: 34px !important;
  border-radius: 11px !important;
  white-space: nowrap !important;
}
.route-genre-filter-list {
  margin: 0 0 12px !important;
  gap: 8px !important;
}
.route-genre-filter-list > button {
  min-height: 34px !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
}
.route-song-count-summary {
  margin: 0 0 12px !important;
}
.route-song-table {
  display: grid !important;
  gap: 10px !important;
}
.route-song-header {
  border-radius: 16px !important;
  padding: 11px 12px !important;
}
.route-song-list {
  display: grid !important;
  gap: 10px !important;
}
.route-song-row {
  min-height: 64px !important;
  border-radius: 18px !important;
  padding: 12px 14px !important;
  align-items: center !important;
}
.route-song-title,
.route-song-artist {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.route-song-meta,
.route-song-row .song-status {
  min-height: 31px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Schedule full-view: clean Monday→Sunday list */
.route-week-list {
  gap: 10px !important;
}
.route-week-row {
  min-height: 88px !important;
  border-radius: 20px !important;
}
.route-week-head {
  grid-template-columns: auto minmax(0,1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
}
.route-week-head > button {
  padding: 0 14px !important;
}

/* Homework & notice full-view tidy */
.route-homework-list,
.route-notice-list {
  display: grid !important;
  gap: 10px !important;
}
.route-homework-row,
.route-notice-item {
  border-radius: 20px !important;
}
.route-homework-row {
  min-height: 64px !important;
  padding: 13px 14px !important;
}
.route-notice-summary {
  min-height: 62px !important;
  padding: 14px 16px !important;
}
.route-notice-content {
  padding: 0 16px 16px !important;
}

/* Mobile refinements */
@media (max-width: 760px) {
  #songbookSection .song-table-header {
    padding: 8px 8px !important;
    border-radius: 14px !important;
    margin-bottom: 8px !important;
  }
  #songbookSection #songRows {
    gap: 8px !important;
  }
  #songbookSection #songRows .song-row {
    padding: 10px 8px !important;
    border-radius: 14px !important;
    min-height: 84px !important;
  }
  #songbookSection #songRows .genre,
  #songbookSection #songRows .difficulty,
  #songbookSection #songRows .song-status {
    min-height: 26px !important;
    font-size: 10px !important;
  }

  .route-page-body {
    padding-top: 10px !important;
  }
  .route-toolbar {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  .route-toolbar > input {
    grid-column: 1 / -1 !important;
  }
  /* hide duplicate full/compact toggle inside mobile songbook body; keep header one */
  .route-toolbar .route-view-toggle {
    display: none !important;
  }
  .route-toolbar > #routeFavoriteOnly {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
  .route-genre-filter-list {
    margin-bottom: 10px !important;
  }
  .route-song-header {
    border-radius: 14px !important;
    padding: 9px 9px !important;
  }
  .route-song-list {
    gap: 8px !important;
  }
  .route-song-row {
    border-radius: 16px !important;
    padding: 10px 10px !important;
  }

  .route-week-head {
    gap: 7px !important;
    margin-bottom: 12px !important;
  }
  .route-week-head > button {
    min-height: 38px !important;
    padding: 0 10px !important;
    font-size: .84rem !important;
    letter-spacing: -0.02em !important;
  }
  .route-week-title h3 {
    font-size: 1.02rem !important;
  }
  .route-week-row {
    min-height: 84px !important;
    border-radius: 16px !important;
  }

  .route-homework-row,
  .route-notice-item {
    border-radius: 16px !important;
  }
  .route-homework-row {
    min-height: 60px !important;
    padding: 11px 12px !important;
  }
  .route-notice-summary {
    min-height: 58px !important;
    padding: 12px 13px !important;
  }
  .route-notice-content {
    padding: 0 13px 13px !important;
  }
}

@media (max-width: 420px) {
  .route-week-head > button {
    padding: 0 8px !important;
    font-size: .8rem !important;
  }
  .route-song-row {
    padding: 9px 8px !important;
  }
}



/* ===== 4. original layout-detail-fix-v27.css ===== */

/* Danmi v27 — notice visibility, PC column precision, equal tabs, mobile week nav */

/* Mobile songbook notice row: keep the notice chip/line visible and readable. */
@media (max-width: 760px) {
  #routePage.route-songbook-mode .route-title-line {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
  }
  #routePage.route-songbook-mode .songbook-notice-chip:not([hidden]) {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 0 !important;
    min-height: 32px !important;
    max-width: min(46vw, 164px) !important;
    padding: 5px 9px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #routePage.route-songbook-mode .songbook-inline-notice:not([hidden]) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 42px !important;
    max-height: 72px !important;
    margin: 0 0 7px !important;
    padding: 8px 10px !important;
    overflow-y: auto !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-radius: 13px !important;
  }
  #routePage.route-songbook-mode .songbook-inline-notice-head {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
  }
}

/* PC songbook: header and rows use the exact same tracks and horizontal rhythm. */
@media (min-width: 761px) {
  #routePage.route-songbook-mode .route-song-table {
    --song-grid-v27: 44px minmax(260px, 1.85fr) minmax(150px, 1fr) 118px 104px 112px;
    --song-gap-v27: 14px;
  }
  #routePage.route-songbook-mode .route-song-header,
  #routePage.route-songbook-mode .route-song-row {
    display: grid !important;
    grid-template-columns: var(--song-grid-v27) !important;
    column-gap: var(--song-gap-v27) !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 16px !important;
  }
  #routePage.route-songbook-mode .route-song-header {
    padding-right: 26px !important; /* row padding + reserved list scrollbar */
  }
  #routePage.route-songbook-mode .route-song-row {
    padding-right: 16px !important;
  }
  #routePage.route-songbook-mode .route-song-list {
    scrollbar-gutter: stable !important;
    scrollbar-width: thin;
  }
  #routePage.route-songbook-mode .route-song-list::-webkit-scrollbar { width: 10px; }

  #routePage.route-songbook-mode .route-song-header > *,
  #routePage.route-songbook-mode .route-song-row > * {
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  #routePage.route-songbook-mode .route-song-header > :nth-child(1),
  #routePage.route-songbook-mode .route-song-row > :nth-child(1) {
    justify-self: center !important;
  }
  #routePage.route-songbook-mode .route-song-header > :nth-child(2),
  #routePage.route-songbook-mode .route-song-header > :nth-child(3),
  #routePage.route-songbook-mode .route-song-row > :nth-child(2),
  #routePage.route-songbook-mode .route-song-row > :nth-child(3) {
    justify-self: stretch !important;
    text-align: left !important;
  }
  #routePage.route-songbook-mode .route-song-header > :nth-child(n+4),
  #routePage.route-songbook-mode .route-song-row > :nth-child(n+4) {
    justify-self: stretch !important;
    text-align: center !important;
  }
  #routePage.route-songbook-mode .route-song-meta,
  #routePage.route-songbook-mode .route-song-row .song-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 32px !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #routePage.route-songbook-mode .route-sort-button {
    width: 100% !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #routePage.route-songbook-mode .route-song-table.compact-mode {
    --song-grid-v27: 44px minmax(340px, 2fr) minmax(190px, 1fr) 112px;
  }
}

/* Homework full-view tabs: force a true 50:50 ratio in every viewport. */
#routePage.route-homework-mode .route-homework-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  gap: 8px !important;
  padding: 4px !important;
  box-sizing: border-box !important;
}
#routePage.route-homework-mode .route-homework-tabs > button {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  line-height: 1 !important;
  border-radius: 13px !important;
}

/* Mobile schedule prev/next: identical size, edges aligned. */
@media (max-width: 760px) {
  #routePage.route-schedule-mode .route-week-head {
    display: grid !important;
    grid-template-columns: 84px minmax(0, 1fr) 84px !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
  }
  #routePage.route-schedule-mode .route-week-head > button {
    box-sizing: border-box !important;
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 7px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    font-size: .84rem !important;
    line-height: 1 !important;
  }
  #routePage.route-schedule-mode #routePrevWeek { justify-self: start !important; }
  #routePage.route-schedule-mode #routeNextWeek { justify-self: end !important; }
  #routePage.route-schedule-mode .route-week-title {
    min-width: 0 !important;
    justify-self: stretch !important;
    text-align: center !important;
  }
}

@media (max-width: 370px) {
  #routePage.route-schedule-mode .route-week-head {
    grid-template-columns: 76px minmax(0, 1fr) 76px !important;
  }
  #routePage.route-schedule-mode .route-week-head > button {
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    font-size: .79rem !important;
    padding-inline: 4px !important;
  }
}