@media (max-width: 860px) {
  .nav-inner {
    padding: 0 14px !important;
    min-height: 52px !important;
  }
  .nav-brand {
    font-size: 17.5px !important;
    gap: 6px !important;
  }
  .nav-brand .seal {
    width: 24px !important;
    height: 24px !important;
    font-size: 13px !important;
  }
  .nav-categories {
    gap: 10px !important;
  }
  .nav-cat-item {
    font-size: 13px !important;
    padding: 6px 2px !important;
  }
  .lang-toggle-btn {
    padding: 5px 8px !important;
    font-size: 11.5px !important;
  }
  .nav-auth-btn {
    padding: 5px 9px !important;
    font-size: 12px !important;
  }
}
.auth-tab-btn {
  flex: 1;
  padding: 10px 0;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  font-size: 13.5px;
  font-weight: 600;
  color: #7A7065;
  cursor: pointer;
  text-align: center;
}
.auth-tab-btn.active {
  color: #8E3826;
  border-bottom-color: #8E3826;
  font-weight: 700;
}


*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
  margin: 0;
  background-color: #FAF7F2;
  color: #1C1410;
  font-family: Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', 'Noto Sans KR', sans-serif;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  word-break: keep-all;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }


.app-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px 80px;
}
@media (min-width: 768px) {
  .app-container { padding: 0 24px 100px; }
}
@media (min-width: 1024px) {
  .app-container { max-width: 1080px; padding: 0 32px 120px; }
  .modules-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 14px !important; }
}


.nav-wrap {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(250, 247, 242, 0.94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(28, 20, 16, 0.08);
}
.nav-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 20px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.nav-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  font-weight: 700;
  color: #1C1410;
  letter-spacing: -0.02em;
  flex-shrink: 0;
}
.nav-brand .seal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: #8E3826;
  color: #FFF;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  font-family: serif;
  line-height: 1;
}
.nav-categories {
  display: flex;
  align-items: center;
  gap: 22px;
}
@media (min-width: 768px) {
  .nav-categories {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    gap: 28px;
  }
}
@media (max-width: 767px) {
  .nav-categories {
    gap: 12px;
    margin: 0 8px;
  }
}

@media (max-width: 520px) {
  .nav-inner { padding: 0 12px; }
  .nav-brand { font-size: 17px; gap: 5px; }
  .nav-categories { gap: 8px; margin: 0 4px; }
  .nav-cat-item { font-size: 14px; padding: 6px 1px; }
  .nav-actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 3px; flex-shrink: 0; }
  #langCurrentText, #navAuthLabel, .lang-toggle-btn > span:last-child { display: none; }
  .lang-toggle-btn, .nav-auth-btn { padding: 4px 5px !important; }
}
.nav-cat-item {
  font-size: 15px;
  font-weight: 600;
  color: #555047;
  padding: 6px 4px;
  position: relative;
  letter-spacing: -0.3px;
  transition: color 0.15s ease;
}
.nav-cat-item:hover { color: #1C1410; }
.nav-cat-item.active {
  color: #8E3826;
  font-weight: 800;
}
.nav-cat-item.active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2.5px;
  background: #8E3826;
  border-radius: 2px;
}
.nav-profile-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 20px;
  background: rgba(142, 56, 38, 0.08);
  color: #8E3826;
  border: 1px solid rgba(142, 56, 38, 0.25);
  transition: all 0.15s ease;
}
.nav-profile-btn:hover {
  background: #8E3826;
  color: #FFF;
}


.hero-card {
  margin-top: 16px;
  margin-bottom: 20px;
  background: #14110E;
  color: #FAF7F2;
  border-radius: 20px;
  padding: 24px 22px;
  position: relative;
  overflow: hidden;
  border: 0;
}
.hero-card::before {
  display: none;
  content: '';
  position: absolute;
  top: -50px;
  right: -50px;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(197, 160, 89, 0.2) 0%, transparent 70%);
  pointer-events: none;
}
.hero-top-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}
.hero-user-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #F0C674;
  text-transform: uppercase;
}
.hero-emblem {
  font-family: 'Gowun Batang', serif;
  font-size: 28px;
  font-weight: 400;
  color: #F0C674;
  line-height: 1;
}
.hero-title {
  font-family: 'Gowun Batang', serif;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.35;
  color: #FAF7F2;
  margin-bottom: 8px;
}
.hero-desc {
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(250, 247, 242, 0.7);
  margin-bottom: 18px;
}
.hero-action-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #FFF;
  color: #191410 !important;
  font-size: 15px;
  font-weight: 700;
  min-height: 44px;
  padding: 0 20px;
  border-radius: 10px;
  border: 0;
  transition: background 0.15s ease;
}
.hero-cta:hover { background: #F4EFE6; }
.hero-dots {
  display: flex;
  gap: 6px;
}
.hero-dot {
  width: 6px;
  height: 6px;
  border-radius: 3px;
  background: rgba(250, 247, 242, 0.25);
  cursor: pointer;
  transition: all 0.2s ease;
}
.hero-dot.active {
  width: 16px;
  background: #C5A059;
}


.season-strip {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 24px;
}
@media (max-width: 480px) {
  .season-strip { grid-template-columns: 1fr; gap: 8px; }
}
.season-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 14px 16px;
  border-radius: 14px;
  background: #FFFFFF;
  border: 1px solid #EAE5DE;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.season-card:hover {
  border-color: #8E3826;
  transform: translateY(-1px);
}
.season-card.primary {
  background: #24201C;
  border-color: #24201C;
  color: #FAF7F2;
}
.season-card-title {
  font-size: 15px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 3px;
}
.season-card.primary .season-card-title {
  color: #FAF7F2;
}
.season-card-desc {
  font-size: 12px;
  color: #7A7065;
  line-height: 1.4;
}
.season-card.primary .season-card-desc {
  color: rgba(250, 247, 242, 0.75);
}


.menu-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(28, 20, 16, 0.12);
}
.menu-head-title {
  font-family: 'Gowun Batang', serif;
  font-size: 22px;
  font-weight: 700;
  color: #1C1410;
}
.menu-head-sub {
  font-size: 12.5px;
  color: #7A7065;
}


.module-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 32px;
}
@media (min-width: 600px) {
  .module-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
}
.module-card {
  background: #FFFFFF;
  border-radius: 16px;
  padding: 18px 16px;
  border: 1px solid #EAE5DE;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 148px;
  transition: all 0.15s ease;
}
.module-card:hover {
  border-color: #8E3826;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(142, 56, 38, 0.08);
}
.module-card.feature {
  background: #201C18;
  border-color: #201C18;
  color: #FAF7F2;
}
.module-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 10px;
}
.module-emblem {
  font-family: 'Gowun Batang', serif;
  font-size: 24px;
  line-height: 1;
  color: #8E3826;
}
.module-card.feature .module-emblem {
  color: #8C6226;
}
.module-pill {
  font-size: 10.5px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(142, 56, 38, 0.1);
  color: #8E3826;
}
.module-card.feature .module-pill {
  background: rgba(140, 98, 38, 0.14);
  color: #8C6226;
}
.module-title {
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 4px;
  line-height: 1.3;
}
.module-card.feature .module-title {
  color: #FAF7F2;
}
.module-sub {
  font-size: 11.5px;
  color: #7A7065;
  line-height: 1.45;
}
.module-card.feature .module-sub {
  color: rgba(250, 247, 242, 0.65);
}


.desk-card {
  background: #FFFFFF;
  border-radius: 20px;
  border: 1px solid #EAE5DE;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
  padding: 22px 20px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  .desk-card { padding: 28px 24px; }
}
.desk-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 16px;
}
.desk-title {
  font-family: 'Gowun Batang', serif;
  font-size: 20px;
  font-weight: 700;
  color: #1C1410;
}
.desk-action-link {
  font-size: 13px;
  font-weight: 700;
  color: #8E3826;
  cursor: pointer;
}
.desk-tabs {
  display: flex;
  gap: 20px;
  border-bottom: 1px solid #EAE5DE;
  margin-bottom: 20px;
}
.desk-tab {
  padding: 8px 4px;
  font-size: 14.5px;
  font-weight: 600;
  color: #7A7065;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: all 0.15s ease;
}
.desk-tab.active {
  color: #8E3826;
  font-weight: 700;
  border-bottom-color: #8E3826;
}
.desk-tab-pane { display: none; }
.desk-tab-pane.active { display: block; }


.chart-empty {
  text-align: center;
  padding: 36px 16px;
  background: #FAF7F2;
  border-radius: 14px;
  border: 1px dashed #D8CFB6;
}
.chart-empty-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 12px;
  background: rgba(142, 56, 38, 0.08);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #8E3826;
}
.chart-empty-title {
  font-family: 'Gowun Batang', serif;
  font-size: 17.5px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 6px;
}
.chart-empty-desc {
  font-size: 13px;
  color: #7A7065;
  line-height: 1.6;
  max-width: 420px;
  margin: 0 auto 18px;
}
.chart-empty-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #8E3826;
  color: #FFF !important;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 22px;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(142, 56, 38, 0.25);
  transition: background 0.15s;
}
.chart-empty-btn:hover { background: #751414; }


.natal-table-wrap {
  margin-bottom: 24px;
}
.natal-table {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.natal-col {
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  border-radius: 12px;
  padding: 12px 4px;
  text-align: center;
  position: relative;
}
.natal-col.day-master-col {
  background: #FFF9F6;
  border: 1.5px solid rgba(142, 56, 38, 0.6);
  box-shadow: 0 2px 8px rgba(142, 56, 38, 0.08);
}
.col-lbl {
  font-size: 11px;
  font-weight: 700;
  color: #7A7065;
  margin-bottom: 4px;
}
.natal-col.day-master-col .col-lbl {
  color: #8E3826;
}
.col-tengod {
  font-size: 11.5px;
  font-weight: 700;
  color: #544B42;
  height: 20px;
  line-height: 20px;
}
.natal-col.day-master-col .col-tengod {
  color: #8E3826;
}
.col-char-stem, .col-char-branch {
  font-family: 'Gowun Batang', serif;
  font-size: 26px;
  font-weight: 700;
  color: #1C1410;
  margin: 6px 0 2px;
  line-height: 1;
}
.col-elem-bar {
  width: 16px;
  height: 3px;
  border-radius: 2px;
  margin: 0 auto 8px;
}
.col-hidden {
  font-size: 11px;
  color: #7A7065;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed rgba(28, 20, 16, 0.1);
  line-height: 1.3;
}
.col-stage {
  font-size: 11px;
  font-weight: 700;
  color: #8E3826;
  margin-top: 4px;
}


.elements-card {
  background: #FAF7F2;
  border-radius: 14px;
  padding: 16px;
  border: 1px solid #EAE5DE;
  margin-bottom: 20px;
}
.elements-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.elements-title {
  font-size: 13.5px;
  font-weight: 700;
  color: #1C1410;
}
.strength-badge {
  font-size: 11.5px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: #8E3826;
  color: #FFF;
}
.element-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  margin-bottom: 7px;
}
.elem-name { flex: 0 0 76px; font-weight: 600; color: #544B42; }
.elem-track {
  flex: 1;
  height: 8px;
  background: #EAE5DE;
  border-radius: 4px;
  overflow: hidden;
}
.elem-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.elem-pct {
  flex: 0 0 32px;
  text-align: right;
  font-size: 12px;
  font-weight: 700;
  color: #544B42;
  font-variant-numeric: tabular-nums;
}


.strength-box {
  background: #FFFFFF;
  border-left: 3px solid #8E3826;
  padding: 12px 14px;
  border-radius: 0 10px 10px 0;
  margin-bottom: 20px;
  border: 1px solid #EAE5DE;
  border-left-width: 3.5px;
}
.strength-desc {
  font-size: 13px;
  line-height: 1.6;
  color: #28231F;
}


.deep-links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (min-width: 540px) {
  .deep-links { grid-template-columns: repeat(4, 1fr); }
}
.deep-pill {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  font-size: 13px;
  font-weight: 700;
  border-radius: 10px;
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  color: #8E3826;
  text-align: center;
  transition: all 0.15s ease;
}
.deep-pill:hover {
  background: #FAF0EB;
  border-color: #8E3826;
}


.iljin-banner {
  background: #FAF7F2;
  border-radius: 14px;
  border: 1px solid #EAE5DE;
  padding: 18px;
  margin-bottom: 16px;
}
.iljin-date-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #8E3826;
  background: rgba(142, 56, 38, 0.08);
  padding: 2px 8px;
  border-radius: 4px;
  margin-bottom: 8px;
}
.iljin-pillar-big {
  font-family: 'Gowun Batang', serif;
  font-size: 24px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 4px;
}
.iljin-energy-desc {
  font-size: 13.5px;
  color: #544B42;
  line-height: 1.6;
  margin-bottom: 14px;
}
.iljin-luck-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  background: #FFFFFF;
  border: 1px solid #EAE5DE;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
  margin-bottom: 14px;
}
.luck-item small { display: block; font-size: 11px; color: #7A7065; }
.luck-item b { font-size: 13.5px; color: #1C1410; }
.iljin-full-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px;
  border-radius: 10px;
  background: #8E3826;
  color: #FFF !important;
  font-size: 14px;
  font-weight: 700;
}


.search-box-wrap {
  position: relative;
  margin-bottom: 14px;
}
.search-input {
  width: 100%;
  height: 44px;
  border-radius: 12px;
  border: 1px solid #D8CFB6;
  background: #FAF7F2;
  padding: 0 44px 0 14px;
  font-size: 14.5px;
  color: #1C1410;
  outline: none;
}
.search-input:focus { border-color: #8E3826; background: #FFF; }
.search-btn {
  position: absolute;
  right: 6px;
  top: 6px;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #8E3826;
  color: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}
.trend-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 20px;
}
.trend-chip {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 14px;
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  color: #544B42;
  transition: all 0.12s;
}
.trend-chip:hover { border-color: #8E3826; color: #8E3826; }

.quick-tools-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 24px;
}
@media (max-width: 480px) {
  .quick-tools-grid { grid-template-columns: 1fr; }
}
.tool-tile {
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  transition: all 0.15s ease;
}
.tool-tile:hover {
  border-color: #8E3826;
  background: #FFFFFF;
  transform: translateY(-1px);
}
.tool-emblem {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(142, 56, 38, 0.08);
  color: #8E3826;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Gowun Batang', serif;
  font-size: 18px;
  font-weight: 700;
  flex-shrink: 0;
}
.tool-title { font-size: 14px; font-weight: 700; color: #1C1410; }
.tool-sub { font-size: 11.5px; color: #7A7065; line-height: 1.35; }


.library-accordion {
  border-top: 1px solid #EAE5DE;
  padding-top: 16px;
}
.library-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: 8px 0;
}
.library-title { font-size: 15px; font-weight: 700; color: #1C1410; }
.library-sub { font-size: 12px; color: #7A7065; }
.library-body {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 10px;
  padding-bottom: 10px;
}
@media (min-width: 600px) {
  .library-body { grid-template-columns: repeat(3, 1fr); }
}
.lib-link {
  font-size: 13px;
  color: #544B42;
  padding: 6px 8px;
  background: #FAF7F2;
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.lib-link:hover { color: #8E3826; }


.trust-section {
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  border-radius: 18px;
  padding: 24px 20px;
  margin-bottom: 32px;
}
.trust-title {
  font-family: 'Gowun Batang', serif;
  font-size: 18px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 14px;
}
.trust-item {
  display: flex;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.6;
  color: #544B42;
  margin-bottom: 10px;
}
.trust-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #8E3826;
  margin-top: 8px;
  flex-shrink: 0;
}
.faq-wrap { margin-top: 20px; padding-top: 16px; border-top: 1px solid #EAE5DE; }
.faq-head { font-size: 15.5px; font-weight: 700; color: #1C1410; margin-bottom: 12px; }
.faq-item {
  border-bottom: 1px solid rgba(28, 20, 16, 0.08);
  padding: 10px 0;
}
.faq-q { font-size: 13.5px; font-weight: 700; color: #28231F; cursor: pointer; display: flex; justify-content: space-between; align-items: center; user-select: none; transition: color .15s; }
.faq-q:hover { color: #8E3826; }
.faq-icon { font-size: 16px; font-weight: 700; color: #8E3826; margin-left: 8px; flex-shrink: 0; }
.faq-a { font-size: 13px; color: #544B42; line-height: 1.65; margin-top: 8px; padding: 10px 12px; background: #FAF7F2; border-radius: 8px; border-left: 3px solid #8E3826; }


.footer {
  border-top: 1px solid #EAE5DE;
  padding-top: 24px;
  text-align: center;
  font-size: 12px;
  color: #7A7065;
  line-height: 1.8;
}
.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 16px;
  margin-bottom: 12px;
  font-weight: 600;
}
.footer-links a:hover { color: #8E3826; }


.modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(20, 16, 12, 0.75);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.modal-overlay.open { display: flex; opacity: 1; }
.modal-card {
  background: #FAF7F2;
  border-radius: 20px;
  border: 1px solid #EAE5DE;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
  max-width: 440px;
  width: 100%;
  padding: 28px 22px;
  position: relative;
  max-height: 90vh;
  overflow-y: auto;
}
.modal-close {
  position: absolute;
  top: 16px; right: 18px;
  font-size: 22px;
  color: #7A7065;
  cursor: pointer;
  line-height: 1;
}
.modal-title {
  font-family: 'Gowun Batang', serif;
  font-size: 21px;
  font-weight: 700;
  color: #1C1410;
  text-align: center;
  margin-bottom: 6px;
}
.modal-sub {
  font-size: 12.5px;
  color: #7A7065;
  text-align: center;
  margin-bottom: 20px;
}
.form-group { margin-bottom: 14px; }
.form-lbl {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #544B42;
  margin-bottom: 5px;
}
.form-row {
  display: flex;
  gap: 8px;
}
.form-input, .form-select {
  width: 100%;
  height: 42px;
  border-radius: 10px;
  border: 1px solid #D8CFB6;
  background: #FFFFFF;
  padding: 0 12px;
  font-size: 14px;
  color: #1C1410;
  outline: none;
}
.form-input:focus, .form-select:focus { border-color: #8E3826; }
.modal-submit-btn {
  width: 100%;
  padding: 13px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
  background: linear-gradient(135deg, #9E3E2B 0%, #8E3826 100%);
  color: #FFF;
  border: 1px solid #751414;
  box-shadow: 0 4px 14px rgba(142, 56, 38, 0.3);
  margin-top: 10px;
  cursor: pointer;
}
.modal-submit-btn:hover { background: #751414; }
.modal-err {
  background: #FFEBEE;
  color: #D32F2F;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
  border-radius: 6px;
  margin-bottom: 12px;
  display: none;
}


.toast {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: #1C1410;
  color: #FAF7F2;
  padding: 10px 20px;
  border-radius: 20px;
  font-size: 13.5px;
  font-weight: 600;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  pointer-events: none;
  opacity: 0;
  transition: all 0.25s ease;
  z-index: 2000;
}
.toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}



.rs-card{border:1px solid #EAE5DE;border-radius:16px;padding:16px;background:#FFFFFF;margin:0 0 16px;box-shadow:0 2px 10px rgba(0,0,0,0.02)}
.rs-card h2{margin:0 0 12px;font-size:17.5px}
.rs-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.rs-p{text-align:center;border:1px solid #EAE5DE;border-radius:12px;padding:10px 4px;background:#FAF7F2}
.rs-p b{display:block;font-size:22px;margin:4px 0 2px;color:#1C1410}
.rs-lbl{font-size:11.5px;color:#7A7065}
.rs-sub{font-size:11.5px;color:#7A7065}
.rs-alert{border-left:3px solid #8E3826;background:#FAF0EB;padding:11px 13px;border-radius:0 8px 8px 0;margin:0 0 16px;font-size:14px;line-height:1.65;color:#28231F}
.rs-bars{display:flex;flex-direction:column;gap:7px}
.rs-bar{display:flex;align-items:center;gap:8px;font-size:14px}
.rs-en{flex:0 0 92px}
.rs-track{flex:1;height:8px;background:#EAE5DE;border-radius:4px;overflow:hidden}
.rs-track i{display:block;height:100%;background:#8E3826;border-radius:4px}
.rs-pc{flex:0 0 28px;text-align:right;font-variant-numeric:tabular-nums;color:#6B6B76}
.rs-bar.rs-me .rs-track i{background:#C5A059}
.rs-big{font-size:24px;font-weight:700;margin:0 0 8px;color:#8E3826}
.rs-note{font-size:13px;line-height:1.65;color:#6B6B76;margin:10px 0 0}
.rs-wrap{overflow-x:auto}
.rs-t{border-collapse:collapse;width:100%;font-size:14px}
.rs-t th,.rs-t td{padding:7px 9px;border-bottom:1px solid #EAE2D1;text-align:left}
.rs-t thead th{border-bottom:1px solid #DED5C3;font-size:13px;color:#8E3826}
.rs-dim{color:#A79878}
.rs-paid{background:#FCF7EA;border-color:#D9C89A}


.rs-paywall{background:#1C1410;border:1px solid rgba(197,160,89,0.4);border-radius:16px;padding:24px 20px;margin:24px 0 20px;color:#F6EFE1;position:relative;box-shadow:0 8px 30px rgba(0,0,0,0.25)}
.rs-paywall::before{content:'';position:absolute;top:0;left:24px;right:24px;height:2.5px;background:linear-gradient(90deg,transparent,#C5A059,transparent)}
.rs-pw-badge{display:inline-flex;align-items:center;gap:6px;background:#8E3826;color:#fff;font-size:12px;font-weight:700;padding:4px 10px;border-radius:6px;margin-bottom:12px}
.rs-paywall h2{color:#F6EFE1!important;border-left:0!important;padding-left:0!important;margin:0 0 8px!important;font-size:20px!important;letter-spacing:-0.02em}
.rs-pw-desc{font-size:14px;color:#C4B69B;margin:0 0 20px;line-height:1.65}
.rs-pw-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}
@media(max-width:520px){.rs-pw-grid{grid-template-columns:1fr}}
.rs-pw-item{background:rgba(255,255,255,0.04);border:1px solid rgba(197,160,89,0.22);border-radius:12px;padding:14px 14px 44px;position:relative;overflow:hidden}
.rs-pw-head{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;color:#E8C97A;margin-bottom:8px}
.rs-pw-head span{font-size:11px;padding:1px 6px;background:rgba(197,160,89,0.18);border:1px solid rgba(197,160,89,0.35);border-radius:4px;color:#E8C97A}
.rs-pw-text{font-size:13px;line-height:1.65;color:#D8CDB6;margin:0}
.rs-pw-scrim{position:absolute;bottom:0;left:0;right:0;height:65%;background:linear-gradient(180deg,rgba(28,20,16,0.05) 0%,rgba(28,20,16,0.75) 45%,#1C1410 100%);display:flex;align-items:flex-end;justify-content:center;padding-bottom:10px}
.rs-pw-lock{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:#E8C97A;background:rgba(0,0,0,0.65);padding:3px 9px;border-radius:6px;border:1px solid rgba(197,160,89,0.35)}
.rs-pw-benefits{list-style:none;padding:14px 0;margin:18px 0 20px;border-top:1px solid rgba(197,160,89,0.2);border-bottom:1px solid rgba(197,160,89,0.2)}
.rs-pw-benefits li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#EDE5D8;margin:7px 0}
.rs-pw-benefits i{color:#E8C97A;font-style:normal;font-weight:700}
.rs-pw-cta{display:block;width:100%;text-align:center;padding:14px 20px;min-height:48px;background:linear-gradient(135deg,#9E3E2B 0%,#8E3826 100%);color:#FFFFFF!important;text-decoration:none!important;border-radius:12px;font-weight:800;font-size:16px;border:1px solid #C5A059!important;box-shadow:0 4px 14px rgba(142,56,38,0.35);box-sizing:border-box;transition:transform 0.15s,box-shadow 0.15s}
.rs-pw-cta:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(142,56,38,0.5);color:#fff!important}
.rs-pw-trust{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:#B9A98E;margin-top:12px;text-align:center}


.rs-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(20,10,5,0.72);backdrop-filter:blur(5px);z-index:9999;display:none;align-items:center;justify-content:center;padding:16px;opacity:0;transition:opacity .2s ease}
.rs-modal-overlay.active{display:flex;opacity:1}
.rs-modal-window{background:#FFFDF8;border:1px solid #D8CFB6;box-shadow:0 16px 48px rgba(0,0,0,0.38);border-radius:14px;max-width:560px;width:100%;max-height:86vh;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;transform:scale(0.96);transition:transform .2s ease}
.rs-modal-overlay.active .rs-modal-window{transform:scale(1)}
.rs-modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #EAE2D1;background:#F9F5EC;position:sticky;top:0;z-index:2}
.rs-modal-head h3{margin:0;font-size:18px;color:#131318;font-weight:700}
.rs-modal-close{background:transparent;border:0;font-size:24px;line-height:1;color:#6B6B76;cursor:pointer;padding:4px 8px;border-radius:6px}
.rs-modal-close:hover{color:#131318;background:rgba(0,0,0,0.06)}
.rs-modal-body{padding:20px 22px;font-size:15px;line-height:1.75;color:#241A0C}
.rs-modal-body h4{margin:18px 0 6px;font-size:16px;color:#8E3826}
.rs-modal-body h4:first-child{margin-top:0}
.rs-modal-body p{margin:0 0 12px;font-size:14.5px}
.rs-modal-body ul{margin:0 0 14px;padding-left:1.2em}
.rs-modal-body li{margin-bottom:7px;font-size:14px}
.rs-modal-body .note{background:#F7EDE9;border-left:3px solid #8E3826;padding:11px 13px;border-radius:0 6px 6px 0;font-size:13.5px;color:#6B5E45;margin:12px 0}
.rs-modal-body .badge{display:inline-block;padding:2px 8px;background:#EDE5D8;border-radius:4px;color:#8E3826;font-size:12px;font-weight:700;margin-bottom:8px}
.rs-opt-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;background:#F7F3E8;border:1px solid #D8CFB6;border-radius:8px;color:#8E3826;font-size:13.5px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s}
.rs-opt-btn:hover{background:#EDE5D8;border-color:#C49A45}
body.rs-modal-open{overflow:hidden}


.rs-toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(20px);background:rgba(20,10,5,0.92);color:#FAF6EC;padding:12px 22px;border-radius:30px;font-size:14px;font-weight:600;z-index:10001;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;box-shadow:0 6px 20px rgba(0,0,0,0.3);text-align:center;max-width:90vw;white-space:nowrap}
.rs-toast.active{opacity:1;transform:translateX(-50%) translateY(0)}


.rs-step-box{background:#F7F3E8;border:1px solid #D8CFB6;border-radius:10px;padding:14px 16px;margin:10px 0}
.rs-step-box ol{margin:0;padding-left:1.3em}
.rs-step-box li{margin-bottom:8px;font-size:14.5px;line-height:1.6}
.rs-step-box li:last-child{margin-bottom:0}
.rs-step-box b{color:#8E3826}
.rs-guide-tabs{display:flex;gap:6px;margin-bottom:14px}
.rs-guide-tab{flex:1;padding:8px 0;background:#EDE5D8;border:1px solid #D8CFB6;border-radius:6px;font-size:13.5px;font-weight:700;color:#6B6B76;cursor:pointer;text-align:center}
.rs-guide-tab.active{background:#8E3826;color:#FFF;border-color:#8E3826}


.el-badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:11.5px;font-weight:800;line-height:1;margin-bottom:2px}
.el-wood{background:#E8F5E9;color:#2E7D32;border:1px solid #A5D6A7}
.el-fire{background:#FFEBEE;color:#C62828;border:1px solid #FFCDD2}
.el-earth{background:#FFF8E1;color:#B78103;border:1px solid #FFE082}
.el-metal{background:#ECEFF1;color:#455A64;border:1px solid #CFD8DC}
.el-water{background:#E3F2FD;color:#1565C0;border:1px solid #90CAF9}

.rs-gt .rs-self{background:#FFF9EB;position:relative}
.rs-gt .rs-self::after{content:'\b098 ';position:absolute;top:2px;right:2px;font-size:9.5px;background:#8E3826;color:#fff;padding:1px 4px;border-radius:3px;font-weight:700}


.bar-wood .rs-track i{background:linear-gradient(90deg,#66BB6A,#2E7D32)!important}
.bar-fire .rs-track i{background:linear-gradient(90deg,#EF5350,#C62828)!important}
.bar-earth .rs-track i{background:linear-gradient(90deg,#FDD835,#C49A45)!important}
.bar-metal .rs-track i{background:linear-gradient(90deg,#B0BEC5,#546E7A)!important}
.bar-water .rs-track i{background:linear-gradient(90deg,#42A5F5,#1565C0)!important}


.rs-feedback-box{background:rgba(255,255,255,0.4);border:1px dashed #D8CFB6;border-radius:12px;padding:14px 16px;margin:28px auto 14px;max-width:540px;text-align:center}
.rs-feedback-title{font-size:13.5px;font-weight:600;color:#555047;margin-bottom:8px}
.rs-vote-group{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.rs-vote-btn{display:inline-flex;align-items:center;gap:4px;padding:7px 12px;border-radius:8px;font-size:12.5px;font-weight:600;cursor:pointer;border:1px solid #D8CFB6;background:#FFFFFF;color:#555047;transition:transform .12s,background .15s,border-color .15s}
.rs-vote-btn:hover{background:#F0EBE0;border-color:#C49A45}
.rs-vote-btn.voted{background:#8E3826;color:#FFF;border-color:#8E3826;pointer-events:none}
.rs-feedback-link{display:inline-block;margin-top:8px;font-size:12px;color:#8E3826;text-decoration:underline;cursor:pointer}


.rs-err-fallback{background:#FFF8F8;border:1.5px solid #FFCDD2;border-radius:14px;padding:24px 20px;text-align:center;margin:20px 0}
.rs-err-icon{font-size:36px;margin-bottom:8px}
.rs-err-title{font-size:17px;font-weight:700;color:#C62828;margin-bottom:6px}
.rs-err-desc{font-size:14px;color:#555047;margin-bottom:16px;line-height:1.6}
.rs-err-actions{display:flex;gap:10px;justify-content:center}



.rs-gt{border-collapse:collapse;width:100%;min-width:340px;text-align:center;font-size:14px}
.rs-gt th,.rs-gt td{border:1px solid #DED5C3;padding:6px 4px}

.hl-compact-edit-btn{display:inline-flex;align-items:center;gap:5px;background:#FFFFFF;border:1px solid #D8CFB6;color:#191F28;font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:6px;cursor:pointer;transition:background .15s}
.hl-compact-edit-btn:hover{background:#FAF8F5}


.hl-tg-power-card{margin-top:20px}
.hl-tg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0}
@media(max-width:600px){.hl-tg-grid{grid-template-columns:repeat(2,1fr)}}
.hl-tg-item{border-radius:12px;padding:14px 10px;text-align:center;border:1px solid #EAE5DE;background:#FAF8F5;display:flex;flex-direction:column;justify-content:space-between;min-height:110px}
.hl-tg-icon{font-size:18px;margin-bottom:2px}
.hl-tg-title{font-size:13.5px;font-weight:800;color:#191F28;line-height:1.2}
.hl-tg-sub{font-size:11px;color:#736B5E;margin:2px 0 6px}
.hl-tg-count-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11.5px;font-weight:800;margin-top:auto}
.hl-tg-strategy-box{background:#FAF8F5;border:1px solid #EAE5DE;border-radius:12px;padding:18px 20px;margin-top:14px}
.hl-tg-strategy-head{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:#191F28;margin-bottom:8px}
.hl-tg-strategy-desc{font-size:14px;color:#4E5968;line-height:1.7;margin:0 0 10px}
.hl-tg-tip-box{background:#FFF;border-left:3px solid #8E3826;padding:10px 14px;border-radius:0 8px 8px 0;font-size:13px;color:#554B3A;line-height:1.65}


.hl-tabs{display:none;gap:4px;background:#F0ECE4;padding:4px;border-radius:12px;margin:20px 0 22px;border:1px solid #E5E0D5;position:sticky;top:10px;z-index:90;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-x:auto;-webkit-overflow-scrolling:touch}
.hl-tabs.active{display:flex}
.hl-tab-btn{flex:1;min-width:max-content;flex-shrink:0;padding:11px 12px;border:0;background:transparent;font-size:13.5px;font-weight:600;color:#6B6B76;border-radius:9px;cursor:pointer;text-align:center;transition:all .18s cubic-bezier(0.16, 1, 0.3, 1);white-space:nowrap}

.rs-card{border:1px solid #EAE5DE;border-radius:16px;padding:26px 22px;background:#FFFFFF;box-shadow:0 2px 10px rgba(0,0,0,0.02);margin:0 0 20px}
.rs-card h2{border-left:0!important;padding-left:0!important;margin:0 0 12px!important;font-size:18px!important;font-weight:800!important;color:#191F28!important;letter-spacing:-0.02em!important;display:flex;align-items:center;gap:8px}
.rs-card p{font-size:14.5px;line-height:1.75;color:#4E5968;margin:0 0 12px}
.rs-card .rs-note{background:#FAF8F5;border:1px solid #EAE5DE;border-radius:10px;padding:13px 15px;font-size:13.5px;color:#555047;line-height:1.65;margin:14px 0 0}

.hl-form-card{border:1px solid #EAE5DE;border-radius:16px;padding:26px 22px;background:#FFFFFF;box-shadow:0 4px 16px rgba(0,0,0,0.03);margin:16px 0 22px}
.hl-form-card h2{margin:0 0 8px;font-size:20px;font-weight:800;border-left:0;padding-left:0;color:#191F28;letter-spacing:-0.02em}
.hl-form-sub{margin:0 0 20px;color:#6B7684;font-size:14px;line-height:1.65}
.hl-form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
@media(max-width:520px){.hl-form-grid{grid-template-columns:1fr 1fr}}
.hl-input-field{display:flex;flex-direction:column;gap:5px}
.hl-input-field label{font-size:12.5px;font-weight:700;color:#555047}
.hl-input-field input,.hl-input-field select{width:100%;height:48px;padding:0 14px;border:1px solid #DED8CE;border-radius:10px;font-size:15px;background:#FAF8F5;color:#191F28;box-sizing:border-box;transition:border-color .15s,background .15s}
.hl-input-field input:focus,.hl-input-field select:focus{border-color:#8E3826;background:#FFFFFF;outline:none;box-shadow:0 0 0 3px rgba(142,56,38,0.08)}
.hl-submit-btn{width:100%;height:48px;border:0;border-radius:10px;background:#8E3826;color:#FFF;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .15s,transform .1s}
.hl-submit-btn:hover{background:#772E1E}
.hl-submit-btn:active{transform:scale(0.99)}
.hl-chip-group{display:inline-flex;gap:3px;background:#ECE6DC;padding:3px;border-radius:8px}
.hl-chip-btn{padding:5px 14px;border:none;border-radius:6px;font-size:13px;font-weight:700;cursor:pointer;background:transparent;color:#555047;transition:all .15s}
.hl-chip-btn.active{background:#8E3826!important;color:#FFFFFF!important}


.hl-reel-banner{background:#FAF8F5;border:1px solid #EAE5DE;border-left:4px solid #8E3826;border-radius:12px;padding:18px 20px;margin-bottom:22px}
.hl-rb-tag{display:inline-block;background:#FAF0EB;color:#8E3826;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:5px;margin-bottom:8px;letter-spacing:-0.2px}
.hl-rb-title{font-size:16px;font-weight:800;color:#191F28;line-height:1.45;margin-bottom:6px}
.hl-rb-desc{font-size:13.5px;color:#555047;line-height:1.65;margin:0}

.hl-metaphor-box{background:#FAF8F5;border:1px solid #EAE5DE;border-radius:12px;padding:18px 20px;margin-top:16px}
.hl-metaphor-box.hl-meta-strong{border-left:4px solid #8E3826}
.hl-metaphor-box.hl-meta-weak{border-left:4px solid #2980B9}
.hl-meta-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.hl-meta-badge{font-size:12px;font-weight:700;padding:3px 8px;border-radius:5px}
.hl-meta-strong .hl-meta-badge{background:#FAF0EB;color:#8E3826}
.hl-meta-weak .hl-meta-badge{background:#EBF3FA;color:#2980B9}
.hl-meta-head b{font-size:15px;font-weight:800;color:#191F28}
.hl-meta-desc{font-size:13.5px;color:#4E5968;line-height:1.7;margin:0}


.hl-form-compact-bar{display:none;align-items:center;justify-content:space-between;background:#FAF8F5;border:1px solid #EAE5DE;border-radius:12px;padding:12px 16px;margin-bottom:18px;box-shadow:0 2px 8px rgba(0,0,0,0.02);flex-wrap:wrap;gap:10px}
.hl-compact-info{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hl-compact-badge{display:inline-flex;align-items:center;background:#8E3826;color:#FFF;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:6px;letter-spacing:-0.01em}
.hl-compact-text{font-size:14px;color:#4E5968}
.hl-compact-text b{font-weight:700;color:#191F28}
.hl-compact-edit-btn{display:inline-flex;align-items:center;gap:5px;background:#FFFFFF;border:1px solid #D8CFB6;color:#191F28;font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:6px;cursor:pointer;transition:background .15s}
.hl-compact-edit-btn:hover{background:#FAF8F5}


.hl-tg-power-card{margin-top:20px}
.hl-tg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:16px 0}
@media(max-width:600px){.hl-tg-grid{grid-template-columns:repeat(2,1fr)}}
.hl-tg-item{border-radius:12px;padding:14px 10px;text-align:center;border:1px solid #EAE5DE;background:#FAF8F5;display:flex;flex-direction:column;justify-content:space-between;min-height:110px}
.hl-tg-icon{font-size:18px;margin-bottom:2px}
.hl-tg-title{font-size:13.5px;font-weight:800;color:#191F28;line-height:1.2}
.hl-tg-sub{font-size:11px;color:#736B5E;margin:2px 0 6px}
.hl-tg-count-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11.5px;font-weight:800;margin-top:auto}
.hl-tg-strategy-box{background:#FAF8F5;border:1px solid #EAE5DE;border-radius:12px;padding:18px 20px;margin-top:14px}
.hl-tg-strategy-head{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:#191F28;margin-bottom:8px}
.hl-tg-strategy-desc{font-size:14px;color:#4E5968;line-height:1.7;margin:0 0 10px}
.hl-tg-tip-box{background:#FFF;border-left:3px solid #8E3826;padding:10px 14px;border-radius:0 8px 8px 0;font-size:13px;color:#554B3A;line-height:1.65}


.hl-tabs{display:none;gap:4px;background:#F0ECE4;padding:4px;border-radius:12px;margin:20px 0 22px;border:1px solid #E5E0D5;position:sticky;top:10px;z-index:90;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-x:auto;-webkit-overflow-scrolling:touch}
.hl-tabs.active{display:flex}
.hl-tab-btn{flex:1;min-width:max-content;flex-shrink:0;padding:11px 12px;border:0;background:transparent;font-size:13.5px;font-weight:600;color:#6B6B76;border-radius:9px;cursor:pointer;text-align:center;transition:all .18s cubic-bezier(0.16, 1, 0.3, 1);white-space:nowrap}
.hl-tab-btn.active{background:#FFFFFF;color:#191F28;font-weight:800;box-shadow:0 2px 8px rgba(0,0,0,0.06)}
.hl-tab-pane{display:none}
.hl-tab-pane.active{display:block;animation:hlFadeIn .22s ease-out}
@keyframes hlFadeIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}


.hl-qh-btn{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;background:#FFFDFB;border:1.5px solid #EADDC9;border-radius:14px;cursor:pointer;text-align:left;transition:all .18s ease;box-shadow:0 2px 8px rgba(142,56,38,0.04);margin-bottom:10px;box-sizing:border-box}
.hl-qh-btn:hover{background:#FFF9F2;border-color:#C84B31;transform:translateY(-1px);box-shadow:0 4px 12px rgba(200,75,49,0.12)}
.hl-qh-btn .icon{font-size:24px;line-height:1}
.hl-qh-btn .txt{flex:1;min-width:0}
.hl-qh-btn .txt b{display:block;font-size:15px;color:#191F28;margin-bottom:3px;font-weight:700}
.hl-qh-btn .txt small{display:block;font-size:12.5px;color:#736B5E;line-height:1.4}
.hl-qh-btn .arr{font-size:16px;color:#C84B31;font-weight:700}


.hl-prescription-box{background:linear-gradient(135deg,#FFFDF9 0%,#FAF5EB 100%);border:1.5px solid #D8B877;border-radius:16px;padding:20px 18px;margin-bottom:20px;box-shadow:0 4px 16px rgba(142,56,38,0.08);text-align:left}
.hl-presc-badge{display:inline-flex;align-items:center;gap:6px;background:#8E3826;color:#FFF;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:700;margin-bottom:14px}
.hl-presc-row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px dashed #E5DBCB;font-size:14px;color:#332E27;line-height:1.6}
.hl-presc-row:last-child{border-bottom:none;padding-bottom:0}
.hl-presc-num{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;border-radius:50%;background:#8E3826;color:#FFF;font-size:12px;font-weight:800;margin-top:2px}
.hl-presc-body{flex:1}
.hl-presc-body b{color:#8E3826;margin-right:4px}
.hl-presc-body em{font-style:normal;font-weight:700;color:#191F28}
.hl-presc-row.highlight{background:#FFF6F3;padding:12px 14px;border-radius:12px;border:1px solid #F5C6BC;margin-top:8px}
.hl-blur-lock{background:#ECE6DB;color:#8E3826;padding:2px 8px;border-radius:4px;font-weight:800;font-size:13px;letter-spacing:1px}
.hl-presc-btn{display:inline-block;margin-top:8px;background:#8E3826;color:#FFF;border:none;border-radius:8px;padding:7px 14px;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 2px 6px rgba(142,56,38,0.25);transition:background .15s}
.hl-presc-btn:hover{background:#A8452F}


.hl-hero-card{background:#FAF8F5;border:1px solid #EAE5DE;border-radius:16px;padding:26px 20px;margin-bottom:22px;box-shadow:0 2px 10px rgba(0,0,0,0.02);text-align:center;position:relative}
.hl-hero-badge{display:inline-block;padding:4px 10px;background:#FAF0EB;border-radius:6px;font-size:12px;font-weight:700;color:#8E3826;margin-bottom:10px;letter-spacing:-0.2px}
.hl-hero-title{font-size:24px;font-weight:800;color:#191F28;margin:0 0 8px;line-height:1.3;letter-spacing:-0.02em}
.hl-hero-title span{color:#8E3826}
.hl-hero-desc{font-size:14.5px;color:#4E5968;line-height:1.75;margin:0 0 16px;font-weight:500}
.hl-hero-tags{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.hl-hero-tag{display:inline-block;padding:5px 11px;background:#FFFFFF;border:1px solid #EAE5DE;border-radius:16px;font-size:12.5px;color:#555047;font-weight:600}


.rs-gt{border-collapse:separate;border-spacing:6px;width:100%;min-width:320px;margin:8px 0;border:0}
.rs-gt th,.rs-gt td{border:0;padding:6px 4px;text-align:center}
.rs-gt thead th{background:transparent;color:#8B95A1;font-size:12.5px;font-weight:700;padding-bottom:6px}
.rs-gt tbody th{background:#F7F4EE;color:#736B5E;font-size:12px;font-weight:700;border-radius:10px;width:52px;text-align:center;vertical-align:middle}
.rs-gt .rs-ch{background:#FAF8F5;border:1px solid rgba(0,0,0,0.06);border-radius:14px;padding:12px 4px;transition:transform .15s ease}
.rs-gt .rs-ch b{display:block;font-size:28px;line-height:1.15;color:#191F28;font-weight:700}
.rs-gt .rs-ch span{display:block;font-size:12.5px;color:#6B7684;font-weight:600;margin-top:3px}
.rs-gt .rs-ch.rs-self{background:#FFF6F3;border:1.5px solid #8E3826;box-shadow:0 4px 16px rgba(142,56,38,0.12)}
.rs-gt .rs-ch.rs-self b{color:#8E3826}
.rs-gt .rs-r1 td{background:#FCFAF7;border-radius:10px;font-size:12.5px;font-weight:600;color:#555047;padding:8px 4px}
.rs-gt .rs-hid{background:#FAF8F5;border-radius:10px;padding:8px 4px}
.rs-gt .rs-stage td{background:#FCFAF7;border-radius:10px;font-size:12.5px;color:#555047;padding:8px 4px}


.hl-pres-grid{display:flex;flex-direction:column;gap:10px;margin:14px 0 16px}
.hl-pres-item{background:#FAF8F5;border:1px solid #ECE6DB;border-radius:14px;padding:15px 17px;transition:background .15s}
.hl-pres-head{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;color:#191F28;margin-bottom:6px}
.hl-pres-badge{display:inline-block;padding:2px 8px;background:#EDE4D4;border-radius:6px;font-size:11.5px;color:#8E3826;font-weight:700}
.hl-pres-text{font-size:14px;color:#555047;line-height:1.65;margin:0}


.hl-today-box{display:flex;align-items:center;gap:16px;background:#FAF7F0;border:1px solid #EAE2D2;border-radius:16px;padding:18px 20px;margin:12px 0 16px}
.hl-today-big{font-size:32px;font-weight:800;color:#8E3826;line-height:1;min-width:76px;text-align:center}
.hl-today-meta{font-size:14.5px;color:#4E5968;line-height:1.6}


.rs-track{flex:1;height:10px;background:#ECE8DF;border-radius:999px;overflow:hidden}
.rs-track i{height:100%;border-radius:999px;transition:width 0.8s cubic-bezier(0.16, 1, 0.3, 1)}


.hl-explore-section{margin:44px 0 28px;padding-top:28px;border-top:2px solid #DED5C3}
.hl-explore-header{margin-bottom:20px}


.hl-score-hero {
  background: #FAF8F5;
  border: 1px solid #EAE5DE;
  border-radius: 16px;
  padding: 24px 20px;
  margin-bottom: 20px;
  text-align: center;
  position: relative;
}
.hl-score-kicker {
  font-size: 12px;
  font-weight: 700;
  color: #8E3826;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.hl-score-val-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  margin: 4px 0 10px;
}
.hl-score-num {
  font-size: 56px;
  font-weight: 900;
  color: #191F28;
  line-height: 1;
  font-family: var(--serif, 'Gowun Batang', serif);
}
.hl-score-max {
  font-size: 16px;
  color: #8B7D6B;
  font-weight: 600;
}
.hl-tier-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 800;
  margin-left: 8px;
}
.hl-tier-daegil { background: #FAF0EB; color: #8E3826; border: 1px solid #EACEC6; }
.hl-tier-gil { background: #F2F8F4; color: #2D7D46; border: 1px solid #C8E6C9; }
.hl-tier-pyeong { background: #FAF7EE; color: #8C7B38; border: 1px solid #E6D8A7; }
.hl-tier-hyung { background: #FDF2F2; color: #C0392B; border: 1px solid #F5C6CB; }


.hl-meter-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 18px 0;
}
.hl-meter-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.hl-meter-lbl {
  flex: 0 0 78px;
  font-size: 13.5px;
  font-weight: 700;
  color: #332E27;
  text-align: left;
}
.hl-meter-track {
  flex: 1;
  height: 10px;
  background: #ECE6DB;
  border-radius: 999px;
  overflow: hidden;
}
.hl-meter-fill {
  height: 100%;
  border-radius: 999px;
  background: #8E3826;
  transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.hl-meter-score {
  flex: 0 0 42px;
  text-align: right;
  font-size: 14px;
  font-weight: 800;
  color: #191F28;
  font-variant-numeric: tabular-nums;
}


.hl-life-seasons-grid, .hl-seasons-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 16px 0;
}
@media (max-width: 860px) {
  .hl-life-seasons-grid, .hl-seasons-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
}
@media (max-width: 500px) {
  .hl-life-seasons-grid, .hl-seasons-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}
.hl-season-card {
  background: #FFF;
  border: 1px solid #EAE5DE;
  border-radius: 12px;
  padding: 16px 14px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 4px rgba(0,0,0,0.02);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.hl-season-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,0.06);
}
.hl-season-card-current {
  border: 1.5px solid #8E3826;
  background: #FFFDF8;
  box-shadow: 0 3px 12px rgba(142,56,38,0.1);
}
.hl-season-card-core {
  border: 1px dashed #C8B9A6;
}
.hl-season-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  gap: 4px;
  flex-wrap: wrap;
}
.hl-season-badge {
  font-size: 11.5px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: -0.2px;
}
.phase-spring { background: #E8F5E9; color: #2E7D32; }
.phase-summer { background: #FFF3E0; color: #E65100; }
.phase-autumn { background: #FAF0EB; color: #8E3826; }
.phase-winter { background: #E3F2FD; color: #1565C0; }
.hl-season-age {
  font-size: 11.5px;
  color: #7A7065;
  font-weight: 600;
}
.hl-season-metaphor {
  font-size: 13.5px;
  font-weight: 800;
  color: #191F28;
  margin-bottom: 8px;
  letter-spacing: -0.3px;
}
.hl-season-box {
  background: #FAF8F5;
  border: 1px solid #EAE5DE;
  border-radius: 8px;
  padding: 8px 0;
  text-align: center;
  margin-bottom: 8px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
}
.hl-season-box.current-box {
  background: #FAF0EB;
  border-color: #E8D2C8;
}
.hl-season-hanja {
  font-family: serif;
  font-size: 20px;
  font-weight: 800;
  color: #191F28;
  letter-spacing: 2px;
}
.hl-season-ko {
  font-size: 12.5px;
  font-weight: 700;
  color: #7A7065;
}
.hl-season-chips {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.hl-season-chip {
  font-size: 11px;
  font-weight: 700;
  color: #555047;
  background: #F4EFEB;
  padding: 2px 6px;
  border-radius: 4px;
}
.hl-season-chip.chip-stage {
  color: #8E3826;
  background: #FFF;
  border: 1px solid #E8D2C8;
}
.hl-season-desc {
  font-size: 12.5px;
  color: #4E5968;
  line-height: 1.65;
  margin: 0;
  flex: 1;
  word-break: keep-all;
}


.hl-week-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  align-items: flex-end;
  height: 130px;
  padding: 16px 8px 8px;
  background: #FAF8F5;
  border: 1px solid #EAE5DE;
  border-radius: 14px;
  margin: 16px 0;
}
.hl-week-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
  justify-content: flex-end;
}
.hl-week-bar-wrap {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.hl-week-bar {
  width: 18px;
  background: #D8CFB6;
  border-radius: 4px 4px 0 0;
  transition: height 0.6s ease;
}
.hl-week-col.is-today .hl-week-bar {
  background: #8E3826;
}
.hl-week-val {
  font-size: 11px;
  font-weight: 700;
  color: #555047;
}
.hl-week-day {
  font-size: 12px;
  font-weight: 600;
  color: #736B5E;
}
.hl-week-col.is-today .hl-week-day {
  color: #8E3826;
  font-weight: 800;
}


.hl-gunghap-live-card {
  background: #FAF8F5;
  border: 1.5px solid #F0D5CE;
  border-radius: 16px;
  padding: 22px 20px;
  margin: 18px 0;
}
.hl-gunghap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 12px 0 16px;
}
@media (max-width: 480px) {
  .hl-gunghap-grid { grid-template-columns: 1fr; }
}


.hl-domain-tag-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.hl-domain-tag {
  background: #FFF;
  border: 1px solid #D8CFB6;
  color: #4A4036;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12.5px;
  font-weight: 600;
}





.empty-pillars-preview {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 10px auto 18px;
}
.empty-pillar-box {
  width: 52px;
  height: 68px;
  border-radius: 10px;
  border: 1px solid rgba(28, 20, 16, 0.16);
  background: #FAF7F2;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  font-weight: 700;
  color: rgba(28, 20, 16, 0.35);
}
.empty-wuxing-dots {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 20px;
}
.wuxing-dot {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 700;
  color: #544B42;
}
.wuxing-dot i {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}


.natal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 14px;
  margin-bottom: 16px;
  border-bottom: 1px solid #EAE5DE;
}
.natal-title {
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 2px;
}
.natal-sub {
  font-size: 11.5px;
  color: #7A7065;
}
.natal-daymaster-badge {
  font-size: 11.5px;
  font-weight: 700;
  padding: 4px 11px;
  border-radius: 14px;
  background: rgba(142, 56, 38, 0.08);
  border: 1px solid rgba(142, 56, 38, 0.32);
  color: #8E3826;
  font-family: 'Gowun Batang', serif;
}
.natal-elem-legend {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin: 16px 0 20px;
  flex-wrap: wrap;
}
.elem-legend-dot {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: #544B42;
}
.elem-legend-dot i {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}


.iljin-card { padding: 4px 0; }
.iljin-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #EAE5DE;
}
.iljin-title-group h3 {
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  font-weight: 700;
  color: #1C1410;
  margin-bottom: 2px;
}
.iljin-title-group p { font-size: 12px; color: #7A7065; }
.iljin-me-box {
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 20px;
}
.iljin-me-line { margin-bottom: 12px; }
.iljin-me-line:last-child { margin-bottom: 0; }
.iljin-me-head {
  font-size: 12px;
  font-weight: 600;
  color: #7A7065;
  margin-bottom: 2px;
}
.iljin-me-title {
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  font-weight: 700;
  color: #8E3826;
  margin-bottom: 2px;
}
.iljin-me-body {
  font-size: 13.5px;
  color: #332E27;
  line-height: 1.55;
}
.iljin-tti-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 10px;
}
@media (min-width: 500px) {
  .iljin-tti-grid { grid-template-columns: repeat(6, 1fr); }
}
.iljin-tti-chip {
  background: #FAF7F2;
  border: 1px solid #EAE5DE;
  border-radius: 10px;
  padding: 8px 4px;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: #544B42;
  transition: all 0.12s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  text-decoration: none !important;
}
.iljin-tti-chip:hover {
  border-color: #8E3826;
  color: #8E3826;
  background: #FFF;
}
.iljin-tti-chip.is-user {
  background: #FFF6F3;
  border: 1.5px solid #8E3826;
  color: #8E3826;
  font-weight: 800;
}
.iljin-tti-chip.is-today {
  border-color: #C5A059;
  background: #FCF9F3;
}
.iljin-tti-chip .chip-me-tag {
  background: #8E3826;
  color: #FFF;
  font-size: 9px;
  padding: 1px 4px;
  border-radius: 3px;
  font-weight: 800;
}



.vip-unlocked-banner {
  background: linear-gradient(135deg, #FFFDF8 0%, #FAF5EE 100%);
  border: 1.5px solid #D8B877;
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 22px;
  box-shadow: 0 4px 18px rgba(216, 184, 119, 0.18);
  position: relative;
  overflow: hidden;
}
.vip-unlocked-banner::after {
  content: 'VIP';
  position: absolute;
  top: -8px;
  right: 12px;
  font-size: 54px;
  font-weight: 900;
  color: rgba(216, 184, 119, 0.12);
  pointer-events: none;
}
.vip-banner-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #8E3826;
  color: #FFF;
  font-size: 11.5px;
  font-weight: 800;
  padding: 3px 10px;
  border-radius: 6px;
  margin-bottom: 8px;
}
.vip-banner-title {
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  font-weight: 800;
  color: #191F28;
  margin: 0 0 6px;
}
.vip-banner-desc {
  font-size: 13.5px;
  color: #555047;
  line-height: 1.65;
  margin: 0 0 14px;
}
.vip-banner-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.vip-print-btn {
  background: #FFF;
  border: 1.5px solid #D8CFB6;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #191F28;
  cursor: pointer;
  transition: all 0.15s;
}
.vip-print-btn:hover { background: #FAF8F5; border-color: #8E3826; }
.vip-scroll-btn {
  background: #8E3826;
  color: #FFF !important;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 480px) {
  .natal-table { gap: 4px; }
  .natal-col { padding: 8px 2px; }
  .col-char-stem, .col-char-branch { font-size: 24px !important; }
  .col-lbl { font-size: 10px; }
  .col-tengod, .col-stage, .col-hidden { font-size: 10.5px; }
  .empty-pillar-box { width: 44px; height: 58px; font-size: 15px; }
}



.lang-dropdown-wrap {
  position: relative;
  display: inline-block;
}
.lang-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  background: #FAF7F2;
  border: 1px solid #D8CFB6;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 700;
  color: #544B42;
  cursor: pointer;
  transition: all 0.15s;
}
.lang-toggle-btn:hover {
  background: #FFF;
  border-color: #8E3826;
  color: #8E3826;
}
.lang-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  background: #FFF;
  border: 1px solid #D8CFB6;
  border-radius: 10px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  min-width: 120px;
  z-index: 200;
  padding: 4px;
}
.lang-opt {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #191F28;
  cursor: pointer;
  text-align: left;
  border: none;
  background: transparent;
  transition: background 0.12s;
}
.lang-opt:hover {
  background: #FAF5EE;
  color: #8E3826;
}