:root {
  --ink: #473d57;
  --muted: #847890;
  --line: rgba(138, 110, 168, 0.15);
  --surface: rgba(255, 255, 255, 0.82);
  --surface-strong: rgba(255, 255, 255, 0.95);
  --lavender: #aa8bd6;
  --lavender-deep: #8264ae;
  --pink: #f2bfd9;
  --shadow: 0 18px 55px rgba(114, 84, 143, 0.13);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 8%, rgba(216, 194, 255, .62), transparent 28rem),
    radial-gradient(circle at 88% 18%, rgba(255, 220, 238, .6), transparent 30rem),
    linear-gradient(180deg, #fbf9ff 0%, #fffaff 45%, #faf7ff 100%);
  font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  min-height: 100vh;
}

a { color: inherit; text-decoration: none; }
button { font: inherit; }

.ambient {
  position: fixed;
  pointer-events: none;
  z-index: -1;
  border-radius: 50%;
  filter: blur(26px);
  opacity: .28;
}
.ambient-a { width: 22rem; height: 22rem; top: 20rem; left: -8rem; background: #d4c1ff; }
.ambient-b { width: 24rem; height: 24rem; top: 45rem; right: -9rem; background: #ffd0e8; }

.shell { width: min(1440px, calc(100% - 40px)); margin: 0 auto; }
.site-header { padding-top: 28px; }
.crew-banner-refresh {
  display: block;
  width: min(745px, 100%);
  margin: 0 auto 22px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 20px;
  -webkit-tap-highlight-color: transparent;
}
.crew-banner-refresh:focus-visible {
  outline: 3px solid rgba(126, 92, 168, .45);
  outline-offset: 5px;
}
.crew-banner-refresh .crew-banner {
  transition: transform .18s ease, opacity .18s ease;
}
.crew-banner-refresh:hover .crew-banner { transform: translateY(-2px); }
.crew-banner-refresh:active .crew-banner { transform: scale(.992); opacity: .92; }
.crew-banner {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  filter: drop-shadow(0 14px 26px rgba(125, 96, 160, .16));
}

.title-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}
.eyebrow {
  margin: 0 0 6px;
  color: var(--lavender-deep);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
}
h1, h2 { margin: 0; letter-spacing: -.04em; }
h1 { font-size: clamp(28px, 4vw, 44px); }
h2 { font-size: clamp(24px, 3vw, 32px); }
.subtitle, .section-heading p { margin: 8px 0 0; color: var(--muted); }
.soop-home {
  flex: none;
  padding: 11px 15px;
  border: 1px solid rgba(125, 95, 162, .18);
  border-radius: 14px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 8px 20px rgba(107, 81, 140, .08);
  font-weight: 750;
  transition: .2s ease;
}
.soop-home:hover { transform: translateY(-2px); background: white; }

.card-surface {
  border: 1px solid rgba(132, 100, 166, .14);
  border-radius: 24px;
  background: var(--surface);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}
.toolbar { padding: 18px; }
.week-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.nav-btn, .today-btn {
  border: 1px solid rgba(130, 97, 165, .16);
  background: white;
  color: var(--ink);
  cursor: pointer;
}
.nav-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  font-size: 28px;
  line-height: 1;
}
.today-btn { padding: 9px 12px; border-radius: 12px; font-size: 13px; font-weight: 800; }
.nav-btn:hover, .today-btn:hover { border-color: rgba(130, 97, 165, .4); }
.week-label-wrap { min-width: 250px; text-align: center; }
.week-label { display: block; font-size: 22px; letter-spacing: -.02em; }
.week-sub-label { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }

.member-filters {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px dashed rgba(126, 98, 155, .18);
}
.filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 5px 11px 5px 6px;
  border: 1px solid rgba(123, 97, 151, .14);
  border-radius: 999px;
  background: rgba(255,255,255,.62);
  color: #756980;
  cursor: pointer;
  transition: .18s ease;
}
.filter-chip img { width: 27px; height: 27px; object-fit: cover; object-position: 50% 25%; border-radius: 50%; }
.filter-chip.active:not(.all) {
  color: #4e4258;
  background: color-mix(in srgb, var(--member-accent) 12%, white);
  border-color: color-mix(in srgb, var(--member-accent) 42%, white);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.45);
}
.filter-chip.all { padding-left: 12px; font-weight: 800; }
.filter-chip.all.active { color: white; background: linear-gradient(135deg, #a888d1, #ce9dc7); }

.status-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  padding: 13px 4px 10px;
  color: var(--muted);
  font-size: 12px;
}
.status-strip span { display: inline-flex; align-items: center; gap: 6px; }
.status-note { margin-left: auto; }
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dot.planned { background: #b29bd5; }
.dot.changed { background: #f0ae67; }
.dot.off { background: #b8b3bd; }

.schedule-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.day-column {
  min-width: 0;
  min-height: 420px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 30px rgba(108, 83, 134, .08);
}
.day-column.today {
  border-color: rgba(155, 117, 196, .42);
  box-shadow: 0 16px 34px rgba(116, 84, 151, .14), inset 0 0 0 1px rgba(183, 150, 217, .17);
}
.day-header {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-height: 64px;
  padding: 15px 14px;
  background: linear-gradient(180deg, rgba(239,231,250,.92), rgba(250,247,255,.5));
  border-bottom: 1px solid var(--line);
}
.weekday { font-weight: 900; color: var(--lavender-deep); }
.date-number { font-size: 22px; font-weight: 850; }
.today-badge {
  position: absolute;
  right: 10px;
  top: 10px;
  padding: 4px 6px;
  border-radius: 8px;
  background: #9c7dc4;
  color: white;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}
.day-content { display: flex; flex-direction: column; gap: 9px; padding: 10px; }
.empty-day {
  min-height: 260px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 4px;
  color: #b4aabc;
  text-align: center;
  font-size: 12px;
}
.empty-day span { font-size: 20px; color: #cab7e1; }
.empty-day p { margin: 0; }

.schedule-card {
  position: relative;
  display: block;
  padding: 11px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--member-accent) 26%, white);
  border-left: 4px solid var(--member-accent);
  border-radius: 14px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--member-accent) 11%, white), rgba(255,255,255,.96));
  transition: transform .18s ease, box-shadow .18s ease;
}
.schedule-card:hover { transform: translateY(-2px); box-shadow: 0 10px 20px color-mix(in srgb, var(--member-accent) 13%, transparent); }
.schedule-card.status-changed { border-style: dashed; }
.schedule-card.status-off { opacity: .62; filter: grayscale(.25); }
.schedule-topline, .schedule-member { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.schedule-time { font-size: 17px; font-weight: 900; }
.schedule-status { color: var(--muted); font-size: 10px; font-weight: 850; }
.schedule-platform{
  display:inline-block;
  flex:0 0 auto;
  block-size:24px;
  padding:0;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  overflow:hidden;
  white-space:nowrap;
  text-indent:-9999px;
  color:transparent;
  font-size:0;
  line-height:0;
  background-color:#1c1922;
  background-position:center;
  background-repeat:no-repeat;
  background-size:calc(100% - 10px) calc(100% - 6px);
  box-shadow:0 5px 14px rgba(32,20,44,.12);
}
.schedule-platform.platform-soop{inline-size:84px;background-image:url('./assets/platform/soop-official.svg')}
.schedule-platform.platform-youtube{inline-size:98px;background-image:url('./assets/platform/youtube-official.svg')}
.schedule-platform.platform-youtube_membership{inline-size:98px;background-image:url('./assets/platform/youtube-official.svg')}
html[data-theme="dark"] .schedule-platform{
  background-color:#0e0c12;
  border-color:rgba(255,255,255,.12);
  box-shadow:0 5px 16px rgba(0,0,0,.26);
}
.schedule-topline-meta{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}
.schedule-member { justify-content: flex-start; margin-top: 8px; }
.schedule-member img { width: 25px; height: 25px; border-radius: 8px; object-fit: cover; object-position: 50% 25%; }
.schedule-member strong { font-size: 12px; }
.schedule-title { margin: 8px 0 0; font-size: 13px; font-weight: 800; line-height: 1.42; }
.schedule-note { margin: 5px 0 0; color: #9b7a61; font-size: 10px; line-height: 1.4; }

/* v2.7.3: natural wrapping for member names, broadcast titles and notes */
.schedule-card .schedule-member,
.schedule-card .schedule-member strong,
.schedule-card .schedule-member-name-links,
.schedule-card .schedule-member-name-link,
.schedule-card .schedule-title,
.schedule-card .schedule-note {
  min-width: 0;
}

.schedule-card .schedule-member strong,
.schedule-card .schedule-title,
.schedule-card .schedule-note {
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: break-word;
  line-break: strict;
}

.schedule-card .schedule-title,
.schedule-card .schedule-note {
  text-wrap: pretty;
}

/* v3.0: preserve line breaks entered in the admin schedule memo textarea. */
.schedule-card .schedule-note {
  white-space: pre-line;
}

/* Keep a member's name itself intact whenever possible. */
.schedule-member strong {
  flex: 1 1 auto;
}

.schedule-member-name-links {
  flex: 1 1 auto;
  min-width: 0;
}

.schedule-member-name-link {
  white-space: nowrap;
}

/*
 * 합방 카드는 여러 프로필 이미지가 이름 영역의 너비를 지나치게 좁히지 않도록
 * 프로필과 멤버 이름을 두 줄 구조로 배치합니다.
 */
.schedule-card.is-collab .schedule-member {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 6px;
}

.schedule-card.is-collab .avatar-stack {
  justify-self: start;
  max-width: 100%;
}

.schedule-card.is-collab .schedule-member strong {
  width: 100%;
}

/* Long URLs/English strings without spaces can still escape safely as a fallback. */
@supports (overflow-wrap: anywhere) {
  .schedule-card .schedule-title,
  .schedule-card .schedule-note {
    overflow-wrap: anywhere;
  }
}

.members-section { padding: 54px 0 20px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 17px; }
.member-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.member-card {
  min-width: 0;
  padding: 9px;
  border: 1px solid color-mix(in srgb, var(--member-accent) 23%, white);
  border-radius: 18px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 10px 24px rgba(98, 76, 120, .07);
  transition: transform .18s ease, box-shadow .18s ease;
}
.member-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px color-mix(in srgb, var(--member-accent) 14%, transparent); }
.member-image-wrap { aspect-ratio: 1 / 1.15; overflow: hidden; border-radius: 13px; background: #f5f0fa; }
.member-image-wrap img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; display: block; }
.member-card-copy { padding: 10px 4px 3px; }
.member-card-copy strong { display: block; font-size: 15px; }
.member-card-copy span { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }
.footer { padding: 24px 0 40px; color: #9c93a3; text-align: center; font-size: 11px; line-height: 1.75; }
.footer p { margin: 2px 0; }
.footer a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(156,147,163,.45); }
.footer a:hover { color: #75667f; border-bottom-color: currentColor; }
.footer-copyright { margin-top: 5px !important; font-size: 10px; opacity: .9; }

@media (max-width: 1080px) {
  .schedule-grid {
    grid-template-columns: repeat(7, minmax(160px, 1fr));
    overflow-x: auto;
    padding-bottom: 8px;
    scroll-snap-type: x proximity;
  }
  .day-column { scroll-snap-align: start; }
  .member-cards { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 700px) {
  .shell { width: min(100% - 22px, 1440px); }
  .site-header { padding-top: 14px; }
  .crew-banner-refresh { margin-bottom: 14px; }
  .title-row { align-items: start; }
  .soop-home { display: none; }
  .subtitle { font-size: 13px; }
  .toolbar { padding: 13px; border-radius: 20px; }
  .week-nav { gap: 7px; }
  .week-label-wrap { min-width: 0; flex: 1; }
  .week-label { font-size: 18px; }
  .week-sub-label { font-size: 10px; }
  .today-btn { display: none; }
  .member-filters { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .filter-chip { flex: none; }
  .status-strip { gap: 10px; }
  .status-note { width: 100%; margin-left: 0; }
  .schedule-grid { grid-template-columns: repeat(7, minmax(78vw, 1fr)); }
  .day-column { min-height: 360px; }
  .section-heading { display: block; }
  .section-heading > p { font-size: 12px; }
  .member-cards { grid-template-columns: repeat(2, 1fr); }
}
.header-actions{display:flex;gap:8px;align-items:center}.soft-btn{flex:none;padding:11px 15px;border:1px solid rgba(125,95,162,.18);border-radius:14px;background:rgba(255,255,255,.68);box-shadow:0 8px 20px rgba(107,81,140,.08);font-weight:750;transition:.2s ease}.soft-btn:hover{transform:translateY(-2px);background:#fff}.load-message{padding:18px;text-align:center;color:var(--muted)}.load-message.error{color:#ad5e69}.load-message[hidden]{display:none}.avatar-stack{display:flex;align-items:center}.avatar-stack img{width:25px;height:25px;border-radius:8px;object-fit:cover;object-position:50% 25%;border:2px solid white;margin-left:-6px}.avatar-stack img:first-child{margin-left:0}
@media(max-width:700px){.header-actions .soft-btn{display:inline-flex}.header-actions .soop-home{display:none}.header-actions{margin-left:auto}}

/* v2.2 notice popup */
body.notice-open{overflow:hidden}.notice-overlay{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(47,35,58,.38);backdrop-filter:blur(7px);animation:noticeFade .16s ease}.notice-overlay[hidden]{display:none}.notice-dialog{position:relative;width:min(92vw,520px);max-height:min(82vh,720px);overflow:auto;padding:30px 28px 24px;border:1px solid rgba(166,128,200,.22);border-radius:28px;background:linear-gradient(160deg,rgba(255,255,255,.98),rgba(248,241,255,.98));box-shadow:0 28px 80px rgba(67,46,85,.22);animation:noticePop .2s ease}.notice-dialog::before{content:"";position:absolute;inset:0 0 auto;height:7px;background:linear-gradient(90deg,#c7b2ee,#e8c7e1,#d7c9f5)}.notice-dialog h2{margin:5px 42px 0 0;font-size:26px;line-height:1.3}.notice-close{position:absolute;top:18px;right:18px;width:36px;height:36px;border:1px solid rgba(126,98,155,.14);border-radius:50%;background:rgba(255,255,255,.8);color:#786a82;font-size:24px;line-height:1;cursor:pointer}.notice-close:hover{background:#fff}.notice-popup-content{margin-top:18px;padding:17px 18px;border-radius:17px;background:rgba(255,255,255,.72);border:1px solid rgba(126,98,155,.11);color:#62586a;font-size:14px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}.notice-popup-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.notice-secondary-btn,.notice-primary-btn{border:0;border-radius:13px;padding:11px 15px;font:inherit;font-weight:850;cursor:pointer}.notice-secondary-btn{background:#f1ecf7;color:#78648d}.notice-primary-btn{background:linear-gradient(135deg,#9f80cc,#d0a0ca);color:#fff;box-shadow:0 10px 22px rgba(139,103,177,.2)}@keyframes noticeFade{from{opacity:0}to{opacity:1}}@keyframes noticePop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}@media(max-width:600px){.notice-dialog{padding:26px 19px 18px;border-radius:23px}.notice-dialog h2{font-size:22px}.notice-popup-actions{flex-direction:column-reverse}.notice-secondary-btn,.notice-primary-btn{width:100%}}


/* v2.3.1: titled links inside schedule cards */
.schedule-card.has-custom-links{cursor:default}
/* v2.5.2: 합방 카드는 카드 전체 이동 기능이 없으므로 클릭 가능한 카드처럼 보이지 않게 합니다. */
.schedule-card.is-collab{cursor:default}
.schedule-card.is-collab:hover{transform:none;box-shadow:0 6px 16px color-mix(in srgb,var(--member-accent) 8%,transparent)}

.schedule-links{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px;padding-top:8px;border-top:1px solid color-mix(in srgb,var(--member-accent) 18%,white)}
.schedule-link-btn{display:inline-flex;align-items:center;gap:3px;max-width:100%;padding:6px 8px;border:1px solid color-mix(in srgb,var(--member-accent) 28%,white);border-radius:9px;background:rgba(255,255,255,.78);color:color-mix(in srgb,var(--member-accent) 74%,#4f4357);font-size:10px;font-weight:850;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:transform .15s ease,background .15s ease}
.schedule-link-btn:hover{transform:translateY(-1px);background:#fff}
.schedule-link-btn span{flex:0 0 auto;font-size:9px}

/* v2.3.1: when custom links exist, profile images remain linked to each member's SOOP station */
.schedule-member-linked{align-items:center;flex-wrap:wrap}
.schedule-member-linked .avatar-stack{gap:0}
.schedule-avatar-link{display:inline-flex;border-radius:9px;position:relative;z-index:1;transition:transform .15s ease,filter .15s ease}
.schedule-avatar-link + .schedule-avatar-link{margin-left:-6px}
.schedule-avatar-link:hover{transform:translateY(-2px);z-index:2;filter:brightness(1.04)}
.schedule-avatar-link:focus-visible{outline:2px solid var(--member-accent);outline-offset:2px;z-index:3}
.schedule-avatar-link img{margin-left:0!important}
.schedule-member-name-links{display:flex;flex-wrap:wrap;align-items:center;gap:3px;font-size:12px;font-weight:800}
.schedule-member-name-link{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.schedule-member-name-link:hover{border-bottom-color:currentColor}
.schedule-member-separator{color:#aaa0b1;font-weight:600}


/* v2.4: mobile-first usability pass */
.mobile-swipe-hint{display:none;margin:0 2px 9px;color:#9a8fa2;font-size:11px;text-align:center}
.schedule-grid{-webkit-overflow-scrolling:touch}
.member-filters{-webkit-overflow-scrolling:touch}

@media (max-width:700px){
  html{scroll-padding-top:10px}
  body{min-width:0;overflow-x:hidden}
  .shell{width:calc(100% - 16px)}
  .site-header{padding-top:max(10px,env(safe-area-inset-top))}
  .crew-banner-refresh{width:100%;margin-bottom:12px;border-radius:15px}
  .crew-banner{filter:drop-shadow(0 8px 18px rgba(125,96,160,.13))}

  .title-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px;margin-bottom:14px}
  .title-row h1{font-size:clamp(27px,8vw,34px);line-height:1.08}
  .eyebrow{font-size:10px;letter-spacing:.11em}
  .subtitle{margin-top:6px;font-size:12px;line-height:1.5}
  .header-actions{align-self:start;margin-left:0}
  .header-actions .soft-btn{min-height:42px;padding:9px 11px;border-radius:12px;font-size:12px;white-space:nowrap}

  .toolbar{padding:11px 10px 10px;border-radius:18px}
  .week-nav{gap:6px}
  .nav-btn{width:44px;height:44px;flex:0 0 44px}
  .week-label{font-size:17px}
  .week-sub-label{margin-top:3px;font-size:9.5px;line-height:1.35}
  .member-filters{gap:7px;margin-top:11px;padding-top:11px;padding-bottom:2px;scrollbar-width:none;overscroll-behavior-inline:contain}
  .member-filters::-webkit-scrollbar{display:none}
  .filter-chip{min-height:44px;padding:6px 12px 6px 7px;touch-action:manipulation}
  .filter-chip img{width:30px;height:30px}
  .filter-chip.all{padding-left:14px}

  .status-strip{padding:10px 3px 6px;gap:9px;font-size:10.5px}
  .status-note{font-size:10px;line-height:1.4}
  .mobile-swipe-hint{display:block}

  .schedule-grid{grid-template-columns:repeat(7,minmax(86vw,86vw));gap:9px;align-items:start;overflow-x:auto;overflow-y:visible;padding:2px 1px 10px;scroll-snap-type:x mandatory;scroll-padding-inline:1px;scrollbar-width:none;overscroll-behavior-inline:contain}
  .schedule-grid.is-mobile-height-managed{overflow-y:hidden;transition:height .18s ease}
  .schedule-grid::-webkit-scrollbar{display:none}
  .day-column{min-height:0;height:max-content;border-radius:18px;scroll-snap-align:start;scroll-snap-stop:always}
  .day-header{position:sticky;top:0;z-index:2;min-height:58px;padding:13px 13px;background:linear-gradient(180deg,rgba(242,234,252,.98),rgba(250,247,255,.95));backdrop-filter:blur(10px)}
  .date-number{font-size:21px}
  .day-content{gap:9px;padding:10px}
  .empty-day{min-height:190px}

  .schedule-card{padding:13px;border-radius:14px;touch-action:manipulation}
  .schedule-card:hover{transform:none}
  .schedule-time{font-size:18px}
  .schedule-member{margin-top:9px;gap:7px}
  .schedule-member img,.avatar-stack img{width:28px;height:28px}
  .schedule-member strong,.schedule-member-name-links{font-size:13px}
  .schedule-title{margin-top:9px;font-size:14px;line-height:1.45}
  .schedule-note{font-size:11px;line-height:1.5}
  .schedule-links{gap:7px;margin-top:10px;padding-top:10px}
  .schedule-link-btn{min-height:40px;padding:9px 10px;border-radius:11px;font-size:11px;touch-action:manipulation}

  .members-section{padding:36px 0 14px}
  .section-heading{margin-bottom:13px}
  .section-heading h2{font-size:25px}
  .member-cards{gap:9px}
  .member-card{padding:7px;border-radius:16px;touch-action:manipulation}
  .member-card:hover{transform:none}
  .member-image-wrap{border-radius:12px}
  .member-card-copy{padding:8px 4px 3px}
  .member-card-copy strong{font-size:14px}

  .footer{padding:20px 4px calc(28px + env(safe-area-inset-bottom));font-size:10.5px;line-height:1.65;overflow-wrap:anywhere}
  .footer-copyright{font-size:9.5px}
}

@media (max-width:480px){
  .title-row{grid-template-columns:1fr}
  .header-actions{width:100%;justify-content:flex-end}
  .header-actions .soft-btn{min-height:40px}
  .schedule-grid{grid-template-columns:repeat(7,minmax(90vw,90vw))}
  .schedule-link-btn{flex:1 1 100%;justify-content:center;white-space:normal;text-align:center}
  .today-badge{top:9px;right:9px}
  .member-card-copy span{font-size:10px}
}

@media (max-width:600px){
  .notice-overlay{place-items:end center;padding:0;background:rgba(47,35,58,.42)}
  .notice-dialog{width:100%;max-height:86dvh;padding:26px 18px calc(18px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;border-bottom:0}
  .notice-dialog h2{font-size:21px}
  .notice-popup-content{margin-top:15px;padding:15px;font-size:13px;line-height:1.7}
  .notice-popup-actions{position:sticky;bottom:0;margin:18px -3px -3px;padding-top:8px;background:linear-gradient(180deg,rgba(250,246,255,0),rgba(250,246,255,.98) 25%)}
  .notice-secondary-btn,.notice-primary-btn{min-height:46px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* v2.4.1: full-page screenshot / capture compatibility */
/*
  Long-page capture tools can occasionally rasterize filtered/fixed layers
  separately. Keep the visual tone while avoiding GPU blur layers around the
  header controls and main glass surfaces.
*/
.ambient{
  display:none;
}

.header-actions{
  position:relative;
  z-index:10;
  isolation:isolate;
}

.header-actions .soft-btn,
.header-actions .soop-home{
  position:relative;
  z-index:1;
  opacity:1;
  color:var(--ink);
  background:#fff;
  filter:none !important;
  -webkit-filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  transform:none !important;
  will-change:auto;
  mix-blend-mode:normal;
  text-shadow:none;
  box-shadow:0 6px 16px rgba(107,81,140,.07);
}

.header-actions .soft-btn:hover,
.header-actions .soop-home:hover{
  transform:none !important;
  background:#fff;
}

.card-surface{
  background:rgba(255,255,255,.92);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.notice-overlay{
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

@media (max-width:700px){
  .day-header{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}


/* v2.5: manual LIVE status */
.live-section{margin-top:14px;padding:17px 18px;border-color:rgba(235,92,112,.15);background:#fff}
.live-section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}
.live-section-heading h2{font-size:20px;line-height:1.15}
.live-manual-note{padding:5px 8px;border-radius:999px;background:#fff1f3;color:#ae5967;font-size:9px;font-weight:850;white-space:nowrap}

/* v3.0 Phase 1: SOOP API LIVE source indicator */
.live-manual-note[data-source="api"]{
  background:#f0ebff;
  color:#7456a1;
}
.live-manual-note[data-source="mixed"]{
  background:#fff7df;
  color:#987129;
}
html[data-theme="dark"] .live-manual-note[data-source="api"]{
  background:#332842;
  color:#d2b9f2;
}
html[data-theme="dark"] .live-manual-note[data-source="mixed"]{
  background:#3c3321;
  color:#e0bf72;
}
.live-members{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.live-member-card{
  display:block;
  min-width:0;
  overflow:hidden;
  border-radius:22px;
  color:var(--ink);
  text-decoration:none;
  background:transparent;
  transition:transform .18s ease, opacity .18s ease;
}

.live-member-card:hover{
  transform:translateY(-3px);
}

.live-thumbnail-wrap{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
  border-radius:22px;
  background:linear-gradient(135deg,#ece4f9,#f8edf5);
  box-shadow:0 10px 26px rgba(36,15,54,.08);
}

.live-thumbnail-wrap::after{
  content:"썸네일 갱신 중…";
  position:absolute;
  right:10px;
  bottom:10px;
  z-index:2;
  padding:5px 8px;
  border-radius:999px;
  background:rgba(17,14,24,.78);
  color:#fff;
  font-size:9px;
  font-weight:850;
  opacity:0;
  transform:translateY(4px);
  pointer-events:none;
  transition:opacity .14s ease,transform .14s ease;
}

.live-member-card.is-thumbnail-refreshing .live-thumbnail-wrap::after{
  opacity:1;
  transform:translateY(0);
}

.live-thumbnail{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .22s ease;
}

.live-member-card:hover .live-thumbnail{
  transform:scale(1.02);
}

.live-badge{
  position:absolute;
  left:10px;
  top:10px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:42px;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(15,16,23,.92);
  color:#fff;
  font-size:10px;
  font-weight:950;
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
}

.live-pulse{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ff425f;
  box-shadow:0 0 0 3px rgba(255,66,95,.18);
  flex:0 0 auto;
}

.live-card-meta{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px 4px 2px;
}

.live-card-avatar{
  width:36px;
  height:36px;
  border-radius:50%;
  object-fit:cover;
  flex:0 0 auto;
  border:1px solid rgba(170,150,200,.18);
  background:#f5efff;
}

.live-card-copy{
  min-width:0;
  flex:1 1 auto;
}

.live-card-name{
  display:block;
  min-width:0;
  font-size:16px;
  font-weight:950;
  line-height:1.2;
  color:var(--ink);
  margin:0 0 5px;
}

.live-card-title{
  min-width:0;
  margin:0;
  color:var(--ink);
  font-size:14px;
  font-weight:800;
  line-height:1.42;
  word-break:keep-all;
  overflow-wrap:break-word;
  line-break:strict;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

@media(max-width:1100px){
  .live-members{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:700px){
  .live-section{margin-top:10px;padding:14px}
  .live-section-heading{align-items:center}
  .live-section-heading h2{font-size:18px}
  .live-members{gap:12px}
  .live-card-name{font-size:14px}
  .live-card-title{font-size:12px}
}

@media(max-width:560px){
  /*
   * v3.0 LIVE 모바일 슬라이더 FIX
   * flex + scroll-snap을 사용해 2명 이상 방송 중일 때도
   * 실제 가로 overflow가 안정적으로 생성되도록 합니다.
   */
  .live-section{
    overflow:hidden;
  }

  .live-members{
    display:flex;
    flex-wrap:nowrap;
    gap:12px;
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    padding:0 14% 10px 0;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:0;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    touch-action:pan-x pan-y;
  }

  .live-members::-webkit-scrollbar{
    display:none;
  }

  .live-member-card{
    flex:0 0 86%;
    width:86%;
    max-width:86%;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }

  .live-thumbnail-wrap{
    border-radius:18px;
  }

  .live-card-meta{
    padding:10px 2px 2px;
  }

  .live-card-avatar{
    width:34px;
    height:34px;
  }

  .live-card-name{
    font-size:14px;
  }

  .live-card-title{
    font-size:12px;
    min-height:2.84em;
  }

  .live-section::after{
    content:"← 좌우로 밀어서 현재 방송을 더 볼 수 있어요 →";
    display:block;
    margin-top:8px;
    color:var(--muted);
    font-size:9px;
    font-weight:750;
    text-align:center;
    letter-spacing:-.02em;
  }
}
.filter-avatar-wrap{position:relative;display:inline-flex}
.filter-chip .live-dot{position:absolute;right:-2px;top:-2px;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#ed4d62}
.filter-chip.is-live{box-shadow:inset 0 0 0 1px rgba(237,77,98,.12)}
.member-image-wrap{position:relative}
.member-live-badge{position:absolute;left:8px;top:8px;padding:4px 7px;border-radius:999px;background:#ed4d62;color:#fff;font-size:8px;font-weight:950;letter-spacing:.08em;box-shadow:0 5px 14px rgba(214,58,80,.2)}
.member-card.is-live{border-color:rgba(237,77,98,.2)}



/* =========================================================
   v2.7 — Theme system / Dark mode
   Default preference: system. Resolved theme is set on <html>.
   ========================================================= */
html{
  color-scheme:light;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --ink:#f2ecf8;
  --muted:#b9afc5;
  --line:rgba(202,181,226,.15);
  --surface:rgba(34,27,45,.94);
  --surface-strong:rgba(40,32,52,.98);
  --lavender:#c3a8e7;
  --lavender-deep:#cdb3ef;
  --pink:#e8afcf;
  --shadow:0 18px 55px rgba(0,0,0,.26);
}

.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.theme-control{
  display:inline-flex;
  align-items:center;
  flex:none;
}
.theme-select{
  min-height:42px;
  padding:9px 34px 9px 12px;
  border:1px solid rgba(125,95,162,.18);
  border-radius:14px;
  background:#fff;
  color:var(--ink);
  box-shadow:0 6px 16px rgba(107,81,140,.07);
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  outline:none;
}
.theme-select:focus-visible{
  border-color:rgba(169,139,216,.56);
  box-shadow:0 0 0 3px rgba(169,139,216,.15);
}

html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 12% 8%,rgba(112,82,151,.30),transparent 30rem),
    radial-gradient(circle at 88% 18%,rgba(137,73,112,.22),transparent 32rem),
    linear-gradient(180deg,#17131f 0%,#1b1624 48%,#15111c 100%);
}

html[data-theme="dark"] .crew-banner{
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.30));
}

html[data-theme="dark"] .header-actions .soft-btn,
html[data-theme="dark"] .header-actions .soop-home,
html[data-theme="dark"] .theme-select{
  color:var(--ink);
  background:#282031;
  border-color:rgba(205,179,239,.18);
  box-shadow:0 6px 18px rgba(0,0,0,.20);
}
html[data-theme="dark"] .header-actions .soft-btn:hover,
html[data-theme="dark"] .header-actions .soop-home:hover,
html[data-theme="dark"] .theme-select:hover{
  background:#30263b;
}

html[data-theme="dark"] .card-surface{
  background:#211a2c;
  border-color:rgba(202,181,226,.14);
  box-shadow:0 18px 50px rgba(0,0,0,.22);
}
html[data-theme="dark"] .nav-btn,
html[data-theme="dark"] .today-btn{
  background:#2a2235;
  color:var(--ink);
  border-color:rgba(205,179,239,.16);
}
html[data-theme="dark"] .nav-btn:hover,
html[data-theme="dark"] .today-btn:hover{
  border-color:rgba(205,179,239,.38);
  background:#332940;
}
html[data-theme="dark"] .member-filters{
  border-top-color:rgba(205,179,239,.17);
}
html[data-theme="dark"] .filter-chip{
  background:#2a2235;
  border-color:rgba(205,179,239,.13);
  color:#c8bdd2;
}
html[data-theme="dark"] .filter-chip.active:not(.all){
  color:#f7f1fb;
  background:color-mix(in srgb,var(--member-accent) 20%,#2a2235);
  border-color:color-mix(in srgb,var(--member-accent) 48%,#463752);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
html[data-theme="dark"] .filter-chip.all.active{
  background:linear-gradient(135deg,#896cb2,#b279a3);
  color:#fff;
}

html[data-theme="dark"] .day-column{
  background:#201a29;
  border-color:rgba(202,181,226,.13);
  box-shadow:0 12px 30px rgba(0,0,0,.18);
}
html[data-theme="dark"] .day-column.today{
  border-color:rgba(195,168,231,.42);
  box-shadow:0 16px 34px rgba(0,0,0,.25),inset 0 0 0 1px rgba(195,168,231,.13);
}
html[data-theme="dark"] .day-header{
  background:linear-gradient(180deg,#2c2338,#241d2e);
  border-bottom-color:rgba(202,181,226,.14);
}
html[data-theme="dark"] .empty-day{
  color:#91869d;
}
html[data-theme="dark"] .empty-day span{
  color:#9f88bb;
}

html[data-theme="dark"] .schedule-card{
  border-color:color-mix(in srgb,var(--member-accent) 34%,#30273c);
  border-left-color:var(--member-accent);
  background:linear-gradient(
    145deg,
    color-mix(in srgb,var(--member-accent) 16%,#292133),
    #251e2f
  );
}
html[data-theme="dark"] .schedule-card.status-off{
  opacity:.66;
}
html[data-theme="dark"] .schedule-note{
  color:#d3ad90;
}
html[data-theme="dark"] .avatar-stack img{
  border-color:#251e2f;
}
html[data-theme="dark"] .schedule-links{
  border-top-color:color-mix(in srgb,var(--member-accent) 25%,#3a3045);
}
html[data-theme="dark"] .schedule-link-btn{
  background:#30273b;
  border-color:color-mix(in srgb,var(--member-accent) 35%,#44364f);
  color:color-mix(in srgb,var(--member-accent) 66%,#f2eaf6);
}
html[data-theme="dark"] .schedule-link-btn:hover{
  background:#382d44;
}
html[data-theme="dark"] .schedule-member-separator{
  color:#8f829b;
}

html[data-theme="dark"] .member-card{
  background:#211b2a;
  border-color:color-mix(in srgb,var(--member-accent) 28%,#34293e);
  box-shadow:0 10px 24px rgba(0,0,0,.15);
}
html[data-theme="dark"] .member-image-wrap{
  background:#2a2235;
}
html[data-theme="dark"] .footer{
  color:#a89eaf;
}
html[data-theme="dark"] .footer a:hover{
  color:#d4c6de;
}

html[data-theme="dark"] .notice-overlay{
  background:rgba(5,4,8,.68);
}
html[data-theme="dark"] .notice-dialog{
  background:linear-gradient(160deg,#282031,#211a2a);
  border-color:rgba(205,179,239,.18);
  box-shadow:0 28px 80px rgba(0,0,0,.48);
}
html[data-theme="dark"] .notice-close{
  background:#332940;
  border-color:rgba(205,179,239,.16);
  color:#d8cae3;
}
html[data-theme="dark"] .notice-close:hover{
  background:#3b3048;
}
html[data-theme="dark"] .notice-popup-content{
  background:#2e2539;
  border-color:rgba(205,179,239,.12);
  color:#ded4e6;
}
html[data-theme="dark"] .notice-secondary-btn{
  background:#352a42;
  color:#d5c6e3;
}
html[data-theme="dark"] .notice-primary-btn{
  background:linear-gradient(135deg,#8f70b9,#b978a6);
}
html[data-theme="dark"] .live-section{
  background:#211a2c;
  border-color:rgba(237,92,112,.20);
}
html[data-theme="dark"] .live-manual-note{
  background:#3b2530;
  color:#f0a3af;
}
html[data-theme="dark"] .live-thumbnail-wrap{
  background:linear-gradient(135deg,#33273f,#2b2233);
  box-shadow:0 10px 24px rgba(0,0,0,.24);
}
html[data-theme="dark"] .live-card-name,
html[data-theme="dark"] .live-card-title{
  color:#f5edf9;
}
html[data-theme="dark"] .live-card-avatar{
  background:#2e2538;
  border-color:rgba(197, 161, 234, .22);
}
html[data-theme="dark"] .live-badge{
  background:rgba(6,8,13,.92);
}
html[data-theme="dark"] .live-member-card small{
  color:#d2919c;
}
html[data-theme="dark"] .filter-chip .live-dot{
  border-color:#2a2235;
}

@media(max-width:700px){
  .theme-select{
    min-height:42px;
    border-radius:12px;
    font-size:12px;
  }
  html[data-theme="dark"] .day-header{
    background:linear-gradient(180deg,#2c2338,#241d2e);
  }
}
@media(max-width:480px){
  .header-actions{
    flex-wrap:wrap;
  }
  .theme-control{
    flex:0 0 auto;
  }
}
@media(max-width:600px){
  html[data-theme="dark"] .notice-popup-actions{
    background:linear-gradient(180deg,rgba(33,26,42,0),rgba(33,26,42,.98) 25%);
  }
}

/* =========================================================
   v3.0 LIVE PREVIEW — OFFICIAL
========================================================= */
body.live-preview-open{overflow:hidden}
.live-preview-overlay{
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(8,6,12,.78);
  backdrop-filter:blur(10px);
}
.live-preview-overlay[hidden]{display:none!important}
.live-preview-dialog{
  position:relative;
  width:min(960px,94vw);
  max-height:94vh;
  overflow:auto;
  border:1px solid rgba(190,156,224,.22);
  border-radius:20px;
  background:var(--surface,#fff);
  color:var(--ink);
  box-shadow:0 28px 90px rgba(0,0,0,.48);
}
.live-preview-stage{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#000;
}
.live-preview-frame{
  display:block;
  width:100%;
  height:100%;
  border:0;
  background:#000;
}
.live-preview-frame[hidden]{display:none!important}
.live-preview-close{
  position:absolute;
  right:10px;
  top:10px;
  z-index:10;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:rgba(6,6,8,.72);
  color:#fff;
  font-size:25px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 3px 12px rgba(0,0,0,.24);
  backdrop-filter:blur(5px);
}
.live-preview-close:hover{background:rgba(6,6,8,.90)}
.live-preview-fallback{position:absolute;inset:0;background:#100c17;color:#fff}
.live-preview-fallback[hidden]{display:none!important}
.live-preview-fallback img{width:100%;height:100%;object-fit:cover;opacity:.42;filter:blur(2px)}
.live-preview-fallback-copy{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(430px,82%);
  padding:20px;
  border-radius:16px;
  background:rgba(10,8,15,.80);
  text-align:center;
  backdrop-filter:blur(8px)
}
.live-preview-fallback-copy strong{display:block;margin-bottom:7px;font-size:14px}
.live-preview-fallback-copy span{display:block;font-size:10px;line-height:1.5;color:rgba(255,255,255,.76)}
.live-preview-info{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  padding:20px 22px 22px;
}
.live-preview-copy{min-width:0;flex:1 1 auto}
.live-preview-member-name{
  display:block;
  margin-bottom:10px;
  font-size:28px;
  font-weight:950;
  line-height:1.1;
  letter-spacing:-.035em;
}
.live-preview-broadcast-title{
  margin:0;
  font-size:14px;
  font-weight:800;
  line-height:1.55;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.live-preview-open-soop{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:128px;
  min-height:44px;
  padding:0 17px;
  flex:0 0 auto;
  border-radius:8px;
  background:#2868df;
  color:#fff;
  text-decoration:none;
  font-size:14px;
  font-weight:950;
  transition:filter .15s ease,transform .15s ease;
}
.live-preview-open-soop:hover{filter:brightness(1.07);transform:translateY(-1px)}
html[data-theme="dark"] .live-preview-dialog{
  background:#0c0a10;
  border-color:rgba(206,165,245,.18);
}
html[data-theme="dark"] .live-preview-member-name,
html[data-theme="dark"] .live-preview-broadcast-title{color:#fff}

@media(max-width:700px){
  .live-preview-overlay{padding:10px}
  .live-preview-dialog{width:100%;border-radius:16px}
  .live-preview-close{right:8px;top:8px;width:34px;height:34px}
  .live-preview-info{display:block;padding:15px 16px 16px}
  .live-preview-member-name{margin-bottom:7px;font-size:21px}
  .live-preview-broadcast-title{font-size:12px}
  .live-preview-open-soop{margin-top:14px;min-width:112px;min-height:40px;font-size:12px}
}


@media(max-width:700px){
  .schedule-platform{block-size:20px;background-size:calc(100% - 9px) calc(100% - 5px)}
  .schedule-platform.platform-soop{inline-size:72px}
  .schedule-platform.platform-youtube,
  .schedule-platform.platform-youtube_membership{inline-size:84px}
}