:root {
  --bg:        #ffffff;
  --surface:   #ffffff;
  --surface-2: #f5f5f7;
  --border:    #e8e8ed;
  --border-2:  #d2d2d7;
  --text:      #1d1d1f;
  --text-2:    #6e6e73;
  --text-3:    #86868b;

  --accent:    #0071e3;
  --accent-2:  #0077ed;
  --accent-bg: #f0f7ff;
  --accent-fg: #ffffff;

  --soldout-bg: #f5f5f7;
  --radius-sm: 8px;
  --radius-md: 12px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:        #000000;
    --surface:   #1c1c1e;
    --surface-2: #2c2c2e;
    --border:    #38383a;
    --border-2:  #48484a;
    --text:      #f5f5f7;
    --text-2:    #a1a1a6;
    --text-3:    #8e8e93;
    --accent:    #0a84ff;
    --accent-2:  #409cff;
    --accent-bg: #0a1f33;
    --accent-fg: #ffffff;
    --soldout-bg: #232325;
  }
}
:root[data-theme="dark"] {
  --bg:        #000000;
  --surface:   #1c1c1e;
  --surface-2: #2c2c2e;
  --border:    #38383a;
  --border-2:  #48484a;
  --text:      #f5f5f7;
  --text-2:    #a1a1a6;
  --text-3:    #8e8e93;
  --accent:    #0a84ff;
  --accent-2:  #409cff;
  --accent-bg: #0a1f33;
  --accent-fg: #ffffff;
  --soldout-bg: #232325;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  background: var(--bg);
  color: var(--text);
}
a { color: var(--accent); }

/* 상단 헤더 — deal.kakao.party 의 .topbar 와 같은 구조 */
.topbar {
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}
.topbar-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
  height: 52px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--text);
  font-weight: 700;
  font-size: 16px;
  white-space: nowrap;
}
.brand-mark { display: block; border-radius: 6px; }

.topnav {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  flex: 1;
}
.topnav a.navlink {
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  color: var(--text-2);
  text-decoration: none;
  white-space: nowrap;
}
.topnav a.navlink:hover { background: var(--surface-2); color: var(--text); }
.topnav a.navlink.active { color: var(--text); font-weight: 600; background: var(--surface-2); }
.topnav a.navlink.disabled { opacity: 0.45; pointer-events: none; }
.topnav .badge-soon {
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--text-3);
  margin-left: 4px;
}

/* 준비중 페이지 */
.placeholder-page {
  max-width: 640px;
  margin: 80px auto;
  text-align: center;
  padding: 0 20px;
}
.placeholder-page .icon { font-size: 40px; margin-bottom: 12px; }
.placeholder-page h1 { font-size: 20px; margin: 0 0 8px; }
.placeholder-page p { color: var(--text-2); font-size: 14px; line-height: 1.6; }

/* footer — deal.kakao.party 와 같은 고지 구성 */
.footer {
  border-top: 1px solid var(--border);
  margin-top: 40px;
}
.footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 20px 40px;
}
.disclosure {
  font-size: 12px;
  color: var(--text-3);
  line-height: 1.6;
  margin: 0 0 8px;
}
.footer-note {
  font-size: 12px;
  color: var(--text-3);
  line-height: 1.6;
  margin: 0 0 16px;
}
.footer-links {
  display: flex;
  gap: 16px;
}
.footer-links a {
  font-size: 13px;
  color: var(--text-2);
  text-decoration: none;
}
.footer-links a:hover { color: var(--text); text-decoration: underline; }