:root {
  --bg: #f7f8f3;
  --surface: #ffffff;
  --surface-soft: #f0f5ee;
  --ink: #1f2a24;
  --muted: #64736b;
  --line: #dce4dc;
  --primary: #276b5f;
  --primary-dark: #174d43;
  --primary-soft: #dff0ea;
  --accent: #b85f32;
  --accent-soft: #fff0e7;
  --gold: #a8791c;
  --danger: #b8423a;
  --danger-soft: #ffeceb;
  --warning: #b7791f;
  --warning-soft: #fff6d8;
  --success: #2f7d4f;
  --success-soft: #e6f6ec;
  --shadow: 0 12px 32px rgba(31, 42, 36, 0.08);
  --radius: 8px;
  --max: 1180px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    linear-gradient(180deg, rgba(39, 107, 95, 0.08), transparent 360px),
    var(--bg);
  color: var(--ink);
  font-family:
    Pretendard,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  font-size: 16px;
  line-height: 1.68;
  letter-spacing: 0;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  border: 0;
  cursor: pointer;
}

a {
  color: inherit;
}

.page {
  min-height: 100vh;
}

.wrap {
  width: min(100% - 32px, var(--max));
  margin: 0 auto;
}

.hero {
  padding: 32px 0 22px;
}

.landing-proof-section {
  padding-top: 10px;
}

.landing-proof-section .wrap {
  width: min(100% - 24px, 1320px);
}

.landing-proof-header {
  border: 1px solid rgba(39, 107, 95, 0.16);
  background:
    radial-gradient(circle at 14% 10%, rgba(39, 107, 95, 0.1), transparent 34%),
    linear-gradient(140deg, #ffffff 0%, #f6fbf7 100%);
  box-shadow: 0 18px 42px rgba(31, 42, 36, 0.07);
  padding: clamp(18px, 3vw, 26px);
}

.landing-proof-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 12px;
  border-radius: 999px;
  background: #e7f4ef;
  color: #17624f;
  font-size: 13px;
  font-weight: 900;
}

.landing-proof-header h2 {
  margin: 10px 0 0;
  color: #134a37;
  font-size: clamp(24px, 3.8vw, 36px);
  line-height: 1.22;
}

.landing-proof-header p {
  max-width: 760px;
  margin: 10px 0 0;
  color: #3d5d51;
  font-size: 17px;
  line-height: 1.68;
}

.landing-proof-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.landing-proof-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid rgba(39, 107, 95, 0.14);
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 18px 40px rgba(21, 49, 39, 0.09);
  padding: 10px;
  overflow: hidden;
}

.landing-proof-card-copy {
  min-height: 0;
  padding: 6px 6px 2px;
}

.landing-proof-card-copy span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 24px;
  border-radius: 999px;
  background: #155f51;
  color: #ffffff;
  font-size: 12px;
  font-weight: 950;
}

.landing-proof-card-copy strong {
  display: block;
  margin-top: 6px;
  color: #102e27;
  font-size: 15.5px;
  line-height: 1.34;
}

.landing-proof-image {
  flex: 1;
  margin: 0;
  border: 1px solid rgba(33, 104, 191, 0.12);
  border-radius: 16px;
  background: linear-gradient(180deg, #f9fcff 0%, #f4f9ff 100%);
  padding: 0;
  overflow: hidden;
  aspect-ratio: 4 / 5;
}

.landing-proof-image-trigger {
  width: 100%;
  height: 100%;
  display: flex;
  background: transparent;
  border: 0;
  padding: 0;
  border-radius: inherit;
}

.landing-proof-image-trigger:focus-visible {
  outline: 2px solid #2f7b65;
  outline-offset: 2px;
}

.landing-proof-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center top;
  background: #ffffff;
}

.landing-proof-source {
  margin: -2px 4px 2px;
  color: #6c7b8f;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

.landing-proof-click-hint {
  margin: 12px 2px 0;
  color: #6a7c73;
  font-size: 12px;
  letter-spacing: 0.01em;
}

.landing-proof-note {
  margin: 12px 0 0;
  border: 1px solid rgba(39, 107, 95, 0.16);
  border-radius: 14px;
  background: #fbfefc;
  padding: 14px 16px;
  color: #31594d;
  box-shadow: 0 10px 26px rgba(31, 42, 36, 0.05);
}

.landing-proof-note strong {
  color: #134a37;
}

.landing-proof-actions {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.landing-proof-actions .btn {
  min-height: 44px;
}

.landing-proof-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
}

.landing-proof-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 16, 22, 0.76);
  backdrop-filter: blur(2px);
}

.landing-proof-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(96vw, 1200px);
  height: 92vh;
  margin: 4vh auto;
  display: grid;
  place-items: center;
  padding: 56px 12px 12px;
}

.landing-proof-modal-dialog img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 12px;
}

.landing-proof-modal-close {
  position: absolute;
  top: 6px;
  right: 6px;
  min-height: 44px;
  min-width: 44px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(234, 243, 255, 0.35);
  background: rgba(16, 34, 48, 0.8);
  color: #f3f7ff;
  font-weight: 700;
}

body.modal-open {
  overflow: hidden;
}

@media (min-width: 641px) {
  .landing-proof-image {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .landing-proof-card-report .landing-proof-image {
    overflow: visible;
    background: linear-gradient(180deg, #f9fcff 0%, #f4f9ff 100%);
  }

  .landing-proof-card-report .landing-proof-image img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
    object-position: center center;
    transform: none;
    margin: 0 auto;
  }
}

@media (max-width: 640px) {
  .landing-proof-header p {
    font-size: 15px;
  }

  .landing-proof-card {
    border-radius: 16px;
  }

  .landing-proof-card-copy {
    min-height: auto;
  }

  .landing-proof-card-report .landing-proof-image {
    min-height: auto;
    overflow: visible;
  }

  .landing-proof-image-trigger {
    display: flex;
  }

  .landing-proof-image img,
  .landing-proof-card-report .landing-proof-image img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
    transform: none;
  }
}

.top-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
  text-decoration: none !important;
}

.brand:hover,
.brand:focus,
.brand:focus-visible {
  text-decoration: none !important;
}

.brand-logo-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 60px;
  margin: 0;
  padding: 0;
}

.brand-logo {
  width: auto;
  height: 60px;
  max-width: 100%;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.1));
}

.header-logo {
  height: 46px;
  width: auto;
  object-fit: contain;
  display: block;
}

.brand-logo-text {
  color: #073f34;
  font-weight: 800;
  font-size: clamp(20px, 2.1vw, 22px);
  line-height: 1;
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.brand-mark-fallback {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: var(--radius);
  background: var(--primary);
  color: #fff;
  font-weight: 800;
}

.brand-mark-fallback {
  display: none;
}

.brand-text strong {
  display: block;
  font-size: 18px;
}

.brand-word {
  display: block;
  color: #073f34;
  font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  font-size: clamp(22px, 2.2vw, 26px);
  line-height: 1;
  letter-spacing: -0.04em;
  font-weight: 800;
  text-decoration: none !important;
}

.brand-text,
.brand-text strong {
  margin: 0;
  padding: 0;
  text-decoration: none !important;
}

.brand-calligraphy {
  display: block;
  width: clamp(150px, 17vw, 200px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-top: 2px;
}

.brand-title-fallback {
  display: none;
}

.brand-text span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 64px;
  align-items: center;
}

.hero-copy {
  padding: 30px 0 14px;
}

.hero-calligraphy-wrap {
  margin: 22px 0 18px;
}

.hero-calligraphy {
  display: block;
  width: clamp(420px, 46vw, 680px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin: 0;
}

.hero-calligraphy-fallback {
  display: none;
  margin-bottom: 12px;
  font-size: clamp(36px, 8vw, 68px);
  line-height: 1.02;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--primary-soft);
  color: var(--primary-dark);
  font-size: 14px;
  font-weight: 700;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 12px;
  font-size: clamp(36px, 8vw, 68px);
  line-height: 1.02;
}

.subtitle {
  margin-bottom: 16px;
  color: var(--primary-dark);
  font-size: clamp(24px, 3.9vw, 38px);
  font-weight: 900;
  line-height: 1.28;
  white-space: pre-line;
}

.lead {
  max-width: 620px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.75;
}

.lead-support {
  margin-top: 10px;
  margin-bottom: 0;
  color: #3e685b;
  font-size: 15px;
  line-height: 1.65;
}

.hero-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.point {
  min-height: 120px;
  padding: 22px;
  border: 1px solid rgba(14, 74, 60, 0.1);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 10px 24px rgba(31, 42, 36, 0.06);
}

.point-icon {
  display: inline-flex;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  color: #0a5648;
  font-size: 18px;
}

.point strong {
  display: block;
  margin-bottom: 6px;
  color: #0c473d;
}

.point span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.58;
}

.panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.access-panel {
  padding: 38px 36px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(14, 74, 60, 0.12);
  box-shadow: 0 18px 40px rgba(16, 52, 45, 0.11);
}

.access-panel h2 {
  margin-bottom: 10px;
}

.benefit-note {
  position: relative;
  margin-top: 16px;
  padding: 16px;
  padding-top: 22px;
  padding-right: 136px;
  background: #fffdf9;
}

.benefit-note-logo {
  position: absolute;
  top: 22px;
  right: 22px;
  width: 96px;
  height: auto;
  object-fit: contain;
  opacity: 0.95;
  pointer-events: none;
}

.benefit-note h3 {
  margin-bottom: 8px;
}

.benefit-note p {
  margin-bottom: 10px;
  color: #52635a;
}

.benefit-actions {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.section {
  padding: 40px 0;
}

.section-anchor {
  scroll-margin-top: 90px;
}

#why-jinsim {
  scroll-margin-top: 96px;
}

.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.section-head h2 {
  margin-bottom: 8px;
  font-size: 28px;
  line-height: 1.3;
}

.section-head p {
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.72;
}

.text-measure {
  max-width: 820px;
  line-height: 1.8;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.text-measure-wide {
  max-width: 900px;
}

.section-description {
  max-width: 780px;
  margin-top: 14px;
  line-height: 1.82;
  word-break: keep-all;
  overflow-wrap: anywhere;
  color: #4b5b57;
}

.card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.principle {
  position: relative;
  padding: 0;
  background:
    radial-gradient(
      circle at 92% 20%,
      rgba(39, 125, 95, 0.08) 0%,
      rgba(39, 125, 95, 0.03) 18%,
      transparent 32%
    ),
    linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.98) 0%,
      rgba(249, 253, 250, 0.96) 55%,
      rgba(238, 249, 244, 0.92) 100%
    );
  border-radius: 26px;
  border: 1px solid rgba(10, 77, 61, 0.16);
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(31, 42, 36, 0.06);
  isolation: isolate;
}

.section-anchor#principle {
  padding-top: 24px;
  padding-bottom: 28px;
}

.principle-bg {
  display: none;
}

.principle-content {
  position: relative;
  z-index: 2;
  padding: 16px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.principle-body {
  max-width: 860px;
}

.principle .principle-body.card {
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
}

.principle-note {
  max-width: 900px;
  line-height: 1.85;
}

.principle h2,
.principle h3 {
  margin-bottom: 10px;
  color: #064f3f;
}

.principle p {
  margin-bottom: 0;
  color: #31423a;
  line-height: 1.75;
}

.principle li {
  color: #31423a;
  line-height: 1.78;
  word-break: keep-all;
}

.principle li::marker {
  color: #0a6b55;
}

.principle-clean-card {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
}

.principle-clean h2 {
  font-size: clamp(25px, 2.4vw, 31px);
  line-height: 1.24;
  margin-bottom: 12px;
}

.principle-clean-lead {
  max-width: 620px;
  line-height: 1.68;
}

.principle-clean-lead + .principle-clean-lead {
  margin-top: 8px;
}

.principle-clean-figure {
  margin: 20px auto 0;
  max-width: 620px;
}

.principle-clean-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
  border: 1px solid #d7e5dd;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(20, 56, 42, 0.1);
}

@media (max-width: 760px) {
  .principle-content.principle-clean {
    padding: 14px 10px;
  }

  .principle-clean h2 {
    font-size: clamp(23px, 6.5vw, 28px);
  }

  .principle-clean-figure {
    margin-top: 12px;
  }

  .principle-clean-image {
    border-radius: 12px;
  }
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.field.full {
  grid-column: 1 / -1;
}

.label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

label,
.label {
  font-weight: 800;
  color: #26372f;
}

.hint {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

input,
select,
textarea {
  width: 100%;
  min-height: 50px;
  border: 1px solid #cfd9d1;
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink);
  padding: 13px 14px;
  outline: none;
}

textarea {
  min-height: 168px;
  resize: vertical;
  line-height: 1.6;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(39, 107, 95, 0.13);
}

.checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.checkbox-row input {
  width: 22px;
  height: 22px;
  min-height: 22px;
  margin-top: 2px;
  accent-color: var(--primary);
}

.guide-box {
  border: 1px solid #eadfca;
  border-radius: var(--radius);
  background: #fffaf0;
  padding: 15px;
  color: #4f493b;
}

.guide-box h3 {
  margin-bottom: 8px;
  font-size: 18px;
}

.guide-box ol {
  margin: 0 0 10px;
  padding-left: 20px;
  line-height: 1.65;
}

.guide-box p {
  margin-bottom: 6px;
  color: #665f50;
  font-size: 14px;
  line-height: 1.6;
}

.guide-box p:last-child {
  margin-bottom: 0;
}

.chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.option-chip {
  display: inline-flex;
  position: relative;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  padding: 9px 12px;
  color: #324239;
  font-weight: 800;
  cursor: pointer;
  transition:
    border-color 0.16s ease,
    background 0.16s ease,
    color 0.16s ease;
}

.option-chip input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  accent-color: var(--primary);
}

.option-chip:has(input:checked) {
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary-dark);
}

.pro-option-chip {
  border-color: #bed4c8;
  background: linear-gradient(135deg, #fbfefc, #f4faf6);
}

.premium-option-chip {
  border-color: #e2cfa4;
  background: linear-gradient(135deg, #fffdf7, #fff5de);
  color: #5a4520;
  box-shadow: 0 2px 8px rgba(137, 103, 32, 0.08);
}

.premium-option-chip:hover {
  background: linear-gradient(135deg, #fffef9, #fff8e8);
  border-color: #d8bb81;
}

.premium-option-chip:has(input:checked) {
  border-color: #bf9a56;
  background: linear-gradient(135deg, #fff9eb, #f9ebca);
  color: #4b3716;
}

.option-tooltip {
  position: absolute;
  left: 8px;
  right: 8px;
  top: calc(100% + 8px);
  display: none;
  z-index: 8;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #dae7df;
  background: #fffaf0;
  color: #184738;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 600;
  box-shadow: 0 10px 22px rgba(31, 42, 36, 0.08);
}

.option-tooltip.premium {
  border-color: #e2cfa4;
  background: #fff9ed;
  color: #4a3919;
}

.pro-option-chip:hover .option-tooltip,
.pro-option-chip:focus-within .option-tooltip,
.premium-option-chip:hover .option-tooltip,
.premium-option-chip:focus-within .option-tooltip {
  display: block;
}

.btn {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: var(--radius);
  padding: 12px 16px;
  background: #e8eee8;
  color: var(--ink);
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(31, 42, 36, 0.1);
}

.btn.primary {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 18px rgba(39, 107, 95, 0.2);
}

.btn.primary:hover {
  background: var(--primary-dark);
}

.btn.accent {
  background: var(--accent);
  color: #fff;
}

.btn.ghost {
  border: 1px solid var(--line);
  background: #fff;
}

.btn.danger {
  background: var(--danger-soft);
  color: var(--danger);
}

.btn.small {
  min-height: 44px;
  padding: 9px 12px;
  font-size: 14px;
}

.btn.block {
  width: 100%;
}

.error,
.notice,
.success,
.warning {
  display: none;
  margin-top: 12px;
  border-radius: var(--radius);
  padding: 12px 14px;
  line-height: 1.55;
}

.error.show,
.notice.show,
.success.show,
.warning.show {
  display: block;
}

.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.notice {
  background: var(--primary-soft);
  color: var(--primary-dark);
}

.success {
  background: var(--success-soft);
  color: var(--success);
}

.warning {
  background: var(--warning-soft);
  color: #80530c;
}

.pricing-list {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.pricing-list li {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 9px;
  color: var(--muted);
}

.pricing-list li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.landing-trial-card {
  padding: 20px;
  border: 1px solid #d6eadf;
  border-radius: 24px;
  background: linear-gradient(135deg, #ffffff 0%, #f3fbf7 48%, #e7f5ee 100%);
  box-shadow: 0 18px 44px rgba(20, 60, 40, 0.08);
}

.landing-trial-layout {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 18px;
  align-items: start;
}

.landing-trial-content h2 {
  margin-top: 0;
  margin-bottom: 10px;
}

.landing-trial-note {
  margin-top: 12px;
  margin-bottom: 0;
  color: #2f4f45;
  line-height: 1.7;
}

.landing-trial-actions {
  margin-top: 14px;
}

.landing-trial-benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.landing-trial-benefit {
  padding: 14px;
  border: 1px solid #d7eadf;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
}

.landing-trial-benefit strong {
  display: block;
  margin-bottom: 6px;
  color: #0f6f5c;
}

.landing-trial-benefit span {
  color: #35534a;
  font-size: 14px;
  line-height: 1.56;
}

.app-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(340px, 1.05fr);
  gap: 18px;
  align-items: start;
}

.sticky-side {
  position: sticky;
  top: 18px;
}

.form-panel,
.result-panel {
  padding: 18px;
}

.tone-dna-panel {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #d6e4db;
  background: linear-gradient(180deg, #fcfffd 0%, #f6fbf8 100%);
}

.inline-tone-panel {
  margin-top: 10px;
}

#ownerVoiceDetailsWrap .guide-box {
  border: 1px solid #cfe2d8;
  background: linear-gradient(180deg, #fbfffd 0%, #f2faf6 100%);
}

.tone-dna-premium {
  border-color: #e3d4a1;
  background: linear-gradient(180deg, #fffcf3 0%, #fff9ea 100%);
}

.tone-dna-guide {
  color: #4b4633;
}

.tone-dna-panel h3 {
  margin: 0 0 6px;
  color: #0f4a3a;
}

.tone-dna-card {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.tone-dna-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.tone-dna-field textarea {
  min-height: 84px;
}

.tone-dna-save-row {
  margin-top: 2px;
}

.tone-dna-save {
  min-height: 42px;
}

.tone-dna-status {
  margin-top: 8px;
}

.tone-dna-panel.is-enabled {
  border-color: #b9d7c7;
}

.premium-option-chip input:checked + span ~ .option-tooltip,
.tone-dna-panel.is-enabled {
  box-shadow: 0 8px 18px rgba(23, 84, 63, 0.08);
}

.reply-side-support {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.side-mini-card,
.side-fold-card {
  border: 1px solid #d8e4dc;
  border-radius: 14px;
  background: #fffefb;
  padding: 12px;
  box-shadow: 0 6px 14px rgba(31, 42, 36, 0.04);
}

.side-mini-card h3,
.side-fold-card > summary {
  margin: 0;
  color: #15493a;
  font-size: 16px;
  font-weight: 800;
}

.side-mini-list {
  margin: 8px 0 0;
  padding-left: 18px;
}

.side-mini-list li {
  margin-bottom: 4px;
  color: #344740;
}

.side-status-list p {
  margin: 6px 0;
  color: #33463f;
}

.side-fold-card {
  padding: 10px 12px;
}

.side-fold-card > summary {
  cursor: pointer;
  list-style: none;
}

.side-fold-card > summary::-webkit-details-marker {
  display: none;
}

.coming-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.report-premium-card {
  border-color: #e5d8ab;
  background: linear-gradient(180deg, #fffdf6 0%, #fff9ea 100%);
}

.report-premium-card .tag {
  background: #f3ead0;
  color: #6b4e18;
}

.license-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.top-feature-jump {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}

.jump-card {
  border: 1px solid #d9e4dc;
  border-radius: 14px;
  padding: 12px;
  background: #fffefb;
  box-shadow: 0 4px 12px rgba(31, 42, 36, 0.04);
}

.jump-card h3 {
  margin: 0;
  color: #15493a;
  font-size: 16px;
}

.jump-card-pro {
  border-color: #cde2d7;
  background: linear-gradient(180deg, #fbfffd 0%, #f2faf6 100%);
}

.jump-card-premium {
  border-color: #e4d7aa;
  background: linear-gradient(180deg, #fffdf7 0%, #fff9ea 100%);
}

.ops-welcome {
  margin-top: 10px;
}

.step-progress {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.step-item {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  border: 1px solid #d6e5dc;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 13px;
  color: #355246;
  background: #f8fcfa;
}

.step-item.is-active {
  background: #1f6b53;
  border-color: #1f6b53;
  color: #fff;
}

.rating-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.rating-chip {
  border: 1px solid #cfe2d8;
  background: #f8fcfa;
  color: #1f4f3f;
  border-radius: 999px;
  min-height: 44px;
  padding: 8px 12px;
  font-weight: 700;
}

.rating-chip.active {
  background: #1f6b53;
  border-color: #1f6b53;
  color: #fff;
}

.managed-plan-section {
  border-color: #d6e5dc;
  background: #fffefb;
}

.managed-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

#managed-plans > .wrap > .card {
  background: linear-gradient(180deg, #f8fbf9 0%, #f4f8f6 100%);
}

.managed-plan-card {
  border: 1px solid #d9ece3;
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(135deg, #ffffff 0%, #f3fbf7 55%, #ebf7f1 100%);
  box-shadow: 0 10px 30px rgba(20, 60, 40, 0.08);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  position: relative;
  overflow: hidden;
}

.managed-plan-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 36%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
}

.managed-plan-card:nth-child(2) {
  background: linear-gradient(135deg, #ffffff 0%, #eef8f7 45%, #e1f1ee 100%);
  border-color: #cfe6e1;
}

.managed-plan-card:nth-child(3) {
  background: linear-gradient(135deg, #fffdf8 0%, #f8f2e4 55%, #efe4c9 100%);
  border-color: #e4d5ad;
}

.managed-plan-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(20, 60, 40, 0.12);
}

.managed-plan-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.managed-detail-toggle {
  min-height: 44px;
  font-weight: 700;
  flex: 1;
}

.managed-plan-detail {
  margin-top: 12px;
  padding: 16px;
  border-radius: 12px;
  background: #f0fff4;
  border: 1px solid #d1fae5;
  line-height: 1.7;
}

.managed-plan-detail[hidden] {
  display: none;
}

.managed-detail-title {
  margin: 0 0 6px;
  font-weight: 800;
  color: #059669;
}

.managed-plan-detail p:last-child {
  margin-bottom: 0;
}

.plans-page .top-nav {
  margin-bottom: 10px;
}

.plans-hero .card,
.plan-section .card {
  background: #fffefb;
}

#trial-section {
  scroll-margin-top: 120px;
}

.trial-card {
  padding: 18px;
  border: 1px solid #d4eadf;
  border-radius: 24px;
  background: linear-gradient(135deg, #ffffff 0%, #f2fbf7 50%, #e6f5ee 100%);
  box-shadow: 0 12px 32px rgba(20, 60, 40, 0.07);
}

.trial-layout {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 16px;
  align-items: start;
}

.trial-benefit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.trial-benefit-item {
  padding: 14px;
  border: 1px solid #d8eade;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
}

.trial-benefit-item strong {
  display: block;
  margin-bottom: 6px;
  color: #103f34;
}

.trial-benefit-item span {
  color: #35534a;
  font-size: 14px;
  line-height: 1.55;
}

.trial-extra {
  border: 1px solid #d6e8dc;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.8);
}

.plans-type-grid {
  margin-top: 10px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: stretch;
}

.plan-type-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 198px;
  padding: 20px 20px 18px;
  border-radius: 20px;
  box-shadow: 0 10px 28px rgba(20, 60, 40, 0.06);
  transition:
    transform 0.24s ease,
    box-shadow 0.24s ease,
    border-color 0.24s ease,
    background 0.24s ease;
  overflow: hidden;
}

.plan-type-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: 20px 20px 0 0;
  pointer-events: none;
}

.plan-type-card h3 {
  margin: 0 0 10px;
  color: #103f34;
  font-size: clamp(19px, 2.05vw, 22px);
  line-height: 1.35;
  letter-spacing: -0.01em;
}

.plan-type-card p {
  margin: 0;
  color: #375249;
  line-height: 1.72;
}

.plan-type-card .hint {
  margin-top: 12px;
  color: #2f4a41;
  font-weight: 700;
}

.plan-type-card-self {
  background: linear-gradient(135deg, #ffffff 0%, #f2fbf7 55%, #e8f6ef 100%);
  border: 1px solid #d9ece3;
}

.plan-type-card-self::before {
  background: linear-gradient(90deg, #81c9ac 0%, #a8dcc8 100%);
}

.plan-type-card-managed {
  background: linear-gradient(135deg, #fffdf8 0%, #f8f1e5 58%, #efe2c7 100%);
  border: 1px solid #e6d5ad;
}

.plan-type-card-managed::before {
  background: linear-gradient(90deg, #d8bc83 0%, #e8d4aa 100%);
}

.plan-type-card:hover,
.plan-type-card:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(20, 60, 40, 0.1);
}

.plan-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.plan-card {
  padding: 12px;
  border: 1px solid #d8e4dc;
  border-radius: 12px;
  background: #fff;
}

.plan-card h3 {
  line-height: 1.45;
}

.recommend-box {
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #d9e4dc;
  border-radius: 10px;
  background: #f8fcfa;
}

.recommend-box strong {
  display: block;
  margin-bottom: 6px;
}

.recommend-box ul {
  margin: 0;
  padding-left: 18px;
}

.recommend-box li {
  margin-bottom: 4px;
}

.plan-card.featured {
  border-color: #e4d7aa;
  background: linear-gradient(180deg, #fffdf7 0%, #fff9ea 100%);
}

.plan-card-actions {
  display: flex;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}

.plan-card-actions .btn {
  flex: 1;
  min-width: max-content;
}

.plan-comparison table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}

.plan-comparison th,
.plan-comparison td {
  border: 1px solid #d8e4dc;
  padding: 8px;
  text-align: left;
  font-size: 14px;
  vertical-align: top;
}

.plan-comparison th {
  white-space: nowrap;
  background: #f6faf8;
}

.comparison-toggle-btn {
  min-height: 44px;
  font-weight: 700;
}

.comparison-collapsed[hidden] {
  display: none;
}

.comparison-scroll {
  overflow-x: auto;
}

.plan-guide,
.plan-safety-notice,
.plan-faq {
  border: 1px solid #d9e4dc;
}

.plan-faq details + details {
  margin-top: 8px;
}

.plan-faq-toggle {
  width: 100%;
  min-height: 50px;
  border: 1px solid #cfe0d6;
  border-radius: 14px;
  background: #ffffff;
  color: #1e4b3d;
  font-weight: 800;
  font-size: 15px;
  text-align: left;
  padding: 12px 44px 12px 14px;
  position: relative;
  cursor: pointer;
  transition: background-color 0.16s ease, border-color 0.16s ease;
}

.plan-faq-toggle:hover {
  background: #f7fbf9;
  border-color: #bcd3c7;
}

.plan-faq-toggle::after {
  content: "+";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: #2f6a58;
  font-weight: 700;
}

.plan-faq-toggle[aria-expanded="true"]::after {
  content: "-";
}

.plan-faq-wrap {
  margin-top: 10px;
}

.plan-faq-item {
  border: 1px solid #dbe6df;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
}

.plan-faq-item > summary {
  position: relative;
  cursor: pointer;
  list-style: none;
  padding: 13px 44px 13px 14px;
  font-weight: 700;
  color: #1e4b3d;
  min-height: 46px;
  display: flex;
  align-items: center;
  transition: background-color 0.16s ease;
}

.plan-faq-item > summary::-webkit-details-marker {
  display: none;
}

.plan-faq-item > summary::after {
  content: "+";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  font-weight: 700;
  color: #2f6a58;
}

.plan-faq-item[open] > summary {
  background: #f7fbf9;
}

.plan-faq-item[open] > summary::after {
  content: "-";
}

.plan-faq-item > p {
  margin: 0;
  padding: 0 14px 13px;
  color: #4b5e55;
  line-height: 1.72;
}

.compact-plan-summary ul {
  margin: 0;
  padding-left: 18px;
}

.compact-plan-summary li {
  margin-bottom: 6px;
}

.ops-dashboard {
  margin-top: 10px;
}

.page-title-hero {
  padding: 16px;
  border: 1px solid #dfe9e3;
  background: linear-gradient(160deg, #fffdfa 0%, #f8fcfa 100%);
}

.page-title-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 800;
  color: #3d5c4f;
  background: #edf5f0;
  border: 1px solid #d3e3da;
}

.page-title-hero h1 {
  margin: 8px 0 8px;
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.25;
  color: #21322a;
}

.page-title-hero p {
  margin: 0;
  color: #4b5e54;
  line-height: 1.6;
}

.page-title-hero p + p {
  margin-top: 4px;
}

.top-quick-menu {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.quick-menu-card {
  padding: 12px;
  border: 1px solid #dbe7e0;
  background: linear-gradient(180deg, #ffffff 0%, #f9fcfa 100%);
}

.quick-menu-card h3 {
  margin: 0 0 6px;
  font-size: 16px;
}

.quick-menu-card .hint {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 1200px) {
  .why-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .top-quick-menu {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .why-card-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .why-guide-action .btn {
    width: auto;
  }

  .top-quick-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .top-quick-menu {
    grid-template-columns: 1fr;
  }
}

.ops-card h3 {
  margin: 0 0 6px;
}

.review-import-card {
  margin-top: 10px;
  padding: 14px;
}

.review-import-head h3 {
  margin: 0;
}

.review-import-steps {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.review-import-category-scroll {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 6px;
  margin-top: 10px;
}

.review-import-category-btn {
  flex: 0 0 auto;
}

.review-import-platform-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.review-import-message {
  margin-top: 8px;
}

.review-import-paste-zone {
  margin-top: 10px;
  border: 2px dashed #8ec4ab;
  border-radius: 12px;
  background: #f0faf4;
  padding: 18px 14px 14px;
  min-height: 88px;
  text-align: center;
  transition: border-color 0.15s, background 0.15s;
}

.review-import-paste-zone p {
  margin: 0 0 6px;
}

.review-import-upload-heading {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 700;
  color: #1f5a3d;
}

.review-import-upload-hint {
  margin: 0 0 4px;
  font-size: 13px;
  color: #2d5c47;
}


.review-import-ux-version {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 600;
  color: #1f6b53;
}


.review-import-extract-version {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: #5f786a;
}

.review-import-preview {
  margin-top: 10px;
  width: 100%;
}

.review-import-preview img {
  display: block;
  height: auto;
  margin: 0 auto;
}

.review-read-mode-grid {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.review-read-mode-card {
  border: 1px solid #d7e5dd;
  border-radius: 12px;
  background: #fff;
  padding: 10px;
}

.review-read-mode-card.is-selected {
  border-color: #1f6b53;
  box-shadow: 0 0 0 2px rgba(31, 107, 83, 0.12);
}

.review-read-mode-card h4 {
  margin: 0 0 8px;
}

.review-read-mode-card ul {
  margin: 0 0 10px;
  padding-left: 18px;
}

.review-read-mode-card li {
  margin-bottom: 4px;
}

.review-import-paste-zone.is-drag-over {
  border-color: #1f6b53;
  background: rgba(31, 107, 83, 0.05);
  box-shadow: 0 0 0 2px rgba(31, 107, 83, 0.14);
}

.review-capture-crop-controls {
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid #d7e5dd;
  border-radius: 12px;
  background: #f7faf8;
}

.review-capture-crop-controls .hint {
  margin: 0 0 8px;
}

.review-capture-crop-status {
  margin-top: 6px;
  font-size: 0.85em;
  color: #1f6b53;
}

.crop-img-wrap {
  position: relative;
  width: 100%;
  max-width: 68%;
  border-radius: 12px;
  border: 1px solid #d7e5dd;
  margin: 0 auto;
  touch-action: none;
}

.crop-img-wrap img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border: none;
  border-radius: 0;
  cursor: crosshair;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
}

.crop-sel-box {
  position: absolute;
  border: 2px solid #e74c3c;
  background: rgba(231, 76, 60, 0.12);
  pointer-events: none;
  box-sizing: border-box;
  z-index: 10;
  touch-action: none;
}

.crop-sel-box.hidden {
  display: none;
}

@media (max-width: 768px) {
  .crop-img-wrap {
    max-width: 100%;
  }
}

.review-import-plan-guide {
  margin-top: 10px;
  border: 1px solid #e2ebe5;
  border-radius: 12px;
  background: #fbfdfb;
  padding: 10px;
}

.review-import-plan-guide .hint {
  margin: 0 0 6px;
}

.review-import-bottom-note {
  margin-top: 10px;
}

@media (max-width: 900px) {
  .benefit-note {
    padding-right: 92px;
  }

  .benefit-note-logo {
    top: 16px;
    right: 16px;
    width: 60px;
  }

  .review-read-mode-grid {
    grid-template-columns: 1fr;
  }
}

.ops-section {
  margin-top: 12px;
  padding: 14px;
}

.ops-guide-box {
  margin: 8px 0 10px;
  padding: 10px;
  border-radius: 10px;
}

.menu-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.menu-chip {
  border: 1px solid #cfe2d8;
  background: #f8fcfa;
  color: #1f4f3f;
  border-radius: 999px;
  min-height: 44px;
  padding: 8px 12px;
  font-weight: 700;
}

.menu-chip.active {
  background: #1f6b53;
  border-color: #1f6b53;
  color: #fff;
}

.selected-menu-service-list {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.menu-service-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #cfe2d8;
  background: #f8fcfa;
  color: #1f4f3f;
  border-radius: 999px;
  min-height: 36px;
  padding: 6px 8px 6px 12px;
  font-weight: 700;
}

.menu-service-chip.is-active {
  background: #1f6b53;
  border-color: #1f6b53;
  color: #fff;
}

.menu-service-chip-label {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 0;
  cursor: pointer;
}

.menu-service-chip-remove {
  border: 0;
  background: transparent;
  color: #456f60;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
}

.menu-service-chip.is-active .menu-service-chip-remove {
  color: #f4fbf8;
}

.menu-service-chip-remove:hover,
.menu-service-chip-remove:focus-visible {
  background: #deefe7;
  color: #1f4f3f;
}

.menu-service-chip.is-active .menu-service-chip-remove:hover,
.menu-service-chip.is-active .menu-service-chip-remove:focus-visible {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.empty-menu-service-message {
  margin: 0;
}

.reply-ai-debug-note {
  margin-top: 8px;
  font-size: 12px;
  color: #5f6b63;
}

.menu-add-row {
  margin-top: 8px;
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
}

.image-preview-list {
  display: grid;
  gap: 6px;
  margin-top: 6px;
}

.image-preview-item {
  border: 1px solid #d7e5dd;
  border-radius: 10px;
  padding: 8px 10px;
  background: #fff;
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.recent-review-list {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.recent-review-item {
  padding: 10px;
}

.license-bar strong {
  display: block;
}

.license-bar span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 14px;
}

.status-pill,
.tag,
.plan-pill {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.status-active {
  background: var(--success-soft);
  color: var(--success);
}

.status-expired {
  background: var(--warning-soft);
  color: var(--warning);
}

.status-stopped {
  background: var(--danger-soft);
  color: var(--danger);
}

.tag {
  background: #eef1f4;
  color: #47515c;
}

.plan-pill {
   background: var(--accent-soft);
   color: var(--accent);
}

.plan-include-badge {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: 32px;
   border-radius: 999px;
   padding: 6px 12px;
   font-size: 13px;
   font-weight: 700;
   margin-bottom: 8px;
   white-space: nowrap;
 }

.plan-include-badge.managed {
   background: linear-gradient(135deg, #e6f6ec 0%, #d1fae5 100%);
   color: #065f46;
   border: 1px solid #a7f3d0;
 }

.result-empty {
  display: grid;
  min-height: 280px;
  place-items: center;
  border: 1px dashed #b8c6ba;
  border-radius: var(--radius);
  color: var(--muted);
  text-align: center;
  line-height: 1.7;
}

.reply-list {
  display: grid;
  gap: 14px;
}

.reply-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.reply-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.reply-head h3 {
  margin: 0;
  font-size: 18px;
}

.reply-text {
  min-height: 128px;
  margin-bottom: 14px;
  border-radius: var(--radius);
  background: #f7faf7;
  padding: 15px;
  color: #26342d;
  line-height: 1.78;
  white-space: pre-wrap;
}

.reply-actions,
.quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.quick-actions {
  margin-top: 16px;
}

.result-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}

.usage-inline-note {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.5;
}

.result-usage-note {
  margin: 0 0 12px;
}

.usage-guide-compact {
   margin-top: 8px;
   border: 1px solid #dbe8df;
   border-radius: 12px;
   background: #f8fcfa;
   padding: 10px 12px;
}

.usage-guide-compact summary {
   cursor: pointer;
   font-size: 15px;
   color: #2f5f4b;
   font-weight: 700;
}

.usage-guide-compact p {
   margin: 8px 0 0;
   font-size: 15px;
   line-height: 1.7;
}

.usage-remaining-note {
  margin: 6px 0 0;
  color: #2f5f4b;
  font-weight: 600;
}

.usage-used-note {
  margin: 4px 0 0;
  color: #3c4d45;
  font-weight: 500;
}

.usage-limit-alert,
.usage-limit-result {
  margin-top: 10px;
  border: 1px solid #f2d6b8;
  border-radius: 12px;
  background: #fff8f1;
  padding: 12px;
}

.usage-limit-alert strong,
.usage-limit-result strong {
  display: block;
  color: #7a3d17;
  margin-bottom: 4px;
}

.usage-limit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.usage-limit-purchase {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed #e8c9aa;
}

.usage-limit-purchase-title {
  display: block;
  margin-bottom: 4px;
  color: #6d3715;
}

.usage-limit-purchase-copy {
  margin: 0;
}

.usage-limit-actions-purchase {
  margin-top: 8px;
}

.usage-price-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.usage-price-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid #e4c6a7;
  background: #fffdf9;
  color: #6b3b1b;
  font-size: 13px;
  font-weight: 600;
}

@media (max-width: 768px) {
  .usage-limit-alert,
  .usage-limit-result {
    padding: 11px;
  }

  .usage-limit-actions {
    gap: 6px;
  }
}

.card-option-area {
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 14px;
}

.card-chip-grid {
  margin: 8px 0 12px;
}

.rebuild-btn {
  width: 100%;
}

.cta-band {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 20px;
  border: 1px solid #f0c7ad;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #fff, var(--accent-soft));
}

.cta-band h2 {
  margin-bottom: 8px;
}

.cta-band p {
  margin-bottom: 0;
  color: #71442b;
  line-height: 1.78;
}

.feedback-cta {
  padding: 24px;
  border: 1px solid #dbe8d8;
  border-radius: 20px;
  background: linear-gradient(135deg, #f8fbf4 0%, #eef6ea 100%);
  box-shadow: 0 6px 18px rgba(10, 40, 26, 0.06);
  text-align: center;
}

.feedback-copy h3 {
  margin: 0 0 10px;
  color: #0a3f34;
}

.feedback-copy p {
  margin: 0;
  color: #4f5d55;
  line-height: 1.75;
}

.feedback-btn {
  display: inline-flex;
  margin-top: 16px;
  padding: 12px 20px;
  border-radius: 999px;
  background: #0a3f34;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.feedback-btn:hover,
.feedback-btn:focus-visible {
  background: #135745;
  transform: translateY(-1px);
}

.comparison {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: var(--radius);
  background: #fff;
}

.comparison th,
.comparison td {
  border-bottom: 1px solid var(--line);
  padding: 13px;
  text-align: left;
  vertical-align: top;
  line-height: 1.55;
}

.comparison th {
  background: #eef5f1;
}

.comparison tr:last-child td {
  border-bottom: 0;
}

.faq-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.pricing-grid,
.test-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.pricing-card,
.faq-card,
.test-card {
  padding: 16px;
}

.pricing-link-card {
  cursor: pointer;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.pricing-link-card:hover,
.pricing-link-card:focus-within {
  border-color: #bdd5c8;
  box-shadow: 0 10px 24px rgba(31, 42, 36, 0.08);
  transform: translateY(-1px);
}

.guide-link-hint {
  margin-top: 10px;
  margin-bottom: 0;
  color: #3f5d52;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 700;
}

.faq-card {
  padding: 16px;
}

.faq-card summary {
  cursor: pointer;
  font-weight: 700;
}

.faq-card p {
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.78;
}

.review-analysis-page,
.review-analysis-page p,
.review-analysis-page li,
.analysis-summary-card,
.analysis-panel {
  word-break: keep-all;
  overflow-wrap: break-word;
}

.review-analysis-head-card {
  padding: 20px;
}

.analysis-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.analysis-summary-card {
  padding: 18px;
  border-radius: 16px;
}

.analysis-summary-card h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.analysis-summary-card p {
  margin: 0;
}

.analysis-content-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.analysis-panel {
  padding: 18px;
  border-radius: 16px;
}

.analysis-panel h2 {
  margin-top: 0;
  margin-bottom: 8px;
}

.analysis-list {
  margin: 0;
  padding-left: 18px;
  line-height: 1.62;
}

.analysis-keyword-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.analysis-keyword-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #d7e8df;
  background: #f7fbf9;
  color: #275743;
  font-size: 14px;
}

.analysis-keyword-chip em {
  font-style: normal;
  color: #1f6d4e;
  font-weight: 700;
}

.analysis-empty-card,
.analysis-link-card {
  margin-top: 14px;
  padding: 20px;
}

.review-archive-page,
.review-archive-page p,
.review-archive-page li,
.archive-review-card {
  word-break: keep-all;
  overflow-wrap: break-word;
}

.archive-head-card,
.archive-filter-card,
.archive-empty-card {
  padding: 20px;
}

.archive-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.archive-summary-card {
  padding: 16px;
}

.archive-summary-card h3,
.archive-summary-card p {
  margin: 0;
}

.archive-summary-card h3 {
  margin-bottom: 8px;
}

.archive-filter-card {
  margin-top: 14px;
}

.archive-review-list {
  margin-top: 14px;
  display: grid;
  gap: 14px;
}

.archive-review-card {
  padding: 18px;
}

.archive-card-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.archive-platform-badge,
.archive-rating,
.archive-date,
.archive-nickname,
.archive-status {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid #d7e8df;
  background: #f7fbf9;
  color: #275743;
  font-size: 13px;
}

.archive-status.status-done {
  border-color: #cde6d7;
  background: #eff8f3;
  color: #1f6d4e;
}

.archive-status.status-pending {
  border-color: #e4e6d1;
  background: #fcfcec;
  color: #5c5b2a;
}

.archive-status.status-alert {
  border-color: #efd3d3;
  background: #fff4f4;
  color: #8b2f2f;
}

.archive-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.archive-edit-grid label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  color: #274739;
}

.archive-edit-grid label.full {
  grid-column: 1 / -1;
}

.archive-edit-grid input,
.archive-edit-grid select,
.archive-edit-grid textarea {
  width: 100%;
}

.archive-edit-grid textarea {
  min-height: 92px;
}

.archive-card-actions {
  margin-top: 8px;
}

.archive-privacy-note {
  margin-top: 12px;
}

.guide-hero {
  padding-top: 28px;
}

.guide-hero-card {
  padding: 24px;
  background: linear-gradient(135deg, #ffffff, #f3f8f2);
}

.guide-hero .brand-logo-wrap {
  width: auto;
  height: 60px;
}

.guide-hero .brand-logo {
  width: auto;
  height: 60px;
}

.guide-hero .brand {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.guide-hero .brand-calligraphy {
  width: clamp(145px, 16vw, 190px);
}

.print-cover-meta {
  display: none;
}

.guide-hero-card h1 {
  margin: 10px 0 12px;
  font-size: clamp(32px, 6vw, 54px);
  line-height: 1.12;
}

.guide-core-note {
  margin: 12px 0 0;
  padding: 14px;
  border-radius: var(--radius);
  border: 1px solid #e6dcc7;
  background: #fff8ea;
  color: #5f4a22;
  line-height: 1.74;
}

.guide-grid-3,
.guide-grid-2 {
  display: grid;
  gap: 12px;
}

.guide-grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.guide-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.guide-card {
  padding: 20px;
}

.guide-service-intro-card {
  padding: 24px;
  border-radius: 20px;
  border: 1px solid #d9ece3;
  background: linear-gradient(135deg, #ffffff 0%, #f4fbf7 55%, #edf7f1 100%);
  box-shadow: 0 12px 32px rgba(20, 60, 40, 0.07);
}

.guide-service-intro-card h2 {
  margin-bottom: 10px;
}

.guide-service-intro-card p {
  color: #334740;
  line-height: 1.8;
}

.guide-service-intro-grid {
  margin-top: 12px;
}

.guide-service-mini {
  padding: 16px;
  border-radius: 16px;
  border: 1px solid #d7e8df;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 8px 20px rgba(20, 60, 40, 0.05);
}

.guide-service-mini h3 {
  margin: 0 0 6px;
  color: #13493b;
}

.guide-service-mini p {
  margin: 0;
}

.guide-card h2 {
  margin-bottom: 12px;
}

.guide-part-intro {
  margin-bottom: 12px;
  padding: 10px 12px;
  border-left: 3px solid #bdd5c8;
  background: #f7fbf8;
  border-radius: 0 var(--radius) var(--radius) 0;
  color: #486057;
  font-size: 15px;
  line-height: 1.72;
}

.guide-card p,
.guide-card li {
  color: #3f5148;
  line-height: 1.8;
}

.guide-card ul,
.guide-card ol {
  margin: 10px 0 0;
  padding-left: 18px;
}

.guide-card blockquote {
  margin: 10px 0 0;
  border-left: 4px solid var(--primary);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: #f7faf7;
  padding: 12px 13px;
  line-height: 1.75;
  color: #2f3f36;
}

.guide-mini {
  padding: 15px;
}

.guide-mini h3 {
  margin-bottom: 6px;
}

.guide-mini p {
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.72;
}

.guide-capture-placeholder {
  margin-top: 12px;
  padding: 14px;
  border: 1px dashed #c8d3cc;
  background: #fbfdfb;
}

.guide-capture-placeholder h3 {
  margin-bottom: 6px;
}

.guide-capture-placeholder p {
  margin-bottom: 6px;
  color: #52635a;
}

.guide-capture-placeholder ol {
  margin: 0;
  padding-left: 18px;
}

.guide-capture-placeholder li {
  color: #48584f;
  line-height: 1.65;
}

.guide-read-order {
  margin-top: 14px;
  padding: 16px;
  background: #fbfdfb;
}

.guide-read-order h3 {
  margin-bottom: 8px;
}

.guide-read-order ol {
  margin: 0;
  padding-left: 18px;
  color: #3f5148;
  line-height: 1.8;
}

.guide-toc-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 14px;
}

.guide-toc-list a {
  display: block;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  color: #2f4239;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.guide-toc-list a:hover {
  border-color: #b7cec1;
  background: #f7fbf8;
}

.guide-toc-list a.active {
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary-dark);
}

.guide-toc-mobile {
  display: none;
  padding: 14px;
}

.guide-toc-mobile summary {
  cursor: pointer;
  font-weight: 700;
}

.review-check-card {
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #f9fcfa;
  padding: 10px;
}

.review-check-card.simple {
  background: #f6fbf8;
}

.review-check-head {
  font-weight: 800;
  margin-bottom: 8px;
}

.review-check-summary {
  margin: 0;
  color: #2f4239;
  font-size: 15px;
  line-height: 1.58;
  font-weight: 700;
}

.review-check-block,
.review-check-final {
  margin-top: 8px;
}

.review-check-block strong,
.review-check-final strong {
  display: block;
  margin-bottom: 4px;
}

.review-check-block ul,
.review-check-final ul {
  margin: 0;
  padding-left: 18px;
  color: #3f5148;
  line-height: 1.5;
}

.review-check-note {
  color: var(--muted);
  line-height: 1.6;
}

.review-check-inline-warning {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: var(--radius);
  background: #fff8ec;
  border: 1px solid #f3e2be;
  color: #6a5225;
  line-height: 1.55;
  font-size: 13px;
}

.review-check-detail {
  margin-top: 10px;
  padding-top: 6px;
  border-top: 1px dashed #dce4dc;
}

.review-check-detail summary {
  cursor: pointer;
  font-weight: 700;
}

.review-final-check {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: var(--radius);
  background: #fff7e8;
  border: 1px solid #f0dfbc;
  color: #5f4a22;
  line-height: 1.6;
  font-size: 14px;
}

.review-unified-card {
  border: 1px solid #d8e8de;
  background: linear-gradient(180deg, #fffef9 0%, #f7fcf9 100%);
  border-radius: 14px;
  padding: 12px;
}

.review-unified-header h3 {
  margin: 0 0 6px;
  color: #12483a;
}

.review-unified-header .hint {
  margin: 0 0 6px;
}

.review-unified-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}

.review-unified-field.full {
  grid-column: 1 / -1;
}

.review-record-actions {
  margin-top: 10px;
}

.review-unified-note {
  margin: 8px 0;
}

@media (max-width: 430px) {
  .review-check-card {
    padding: 9px;
  }

  .review-check-block ul,
  .review-check-final ul {
    padding-left: 16px;
  }

  .review-check-detail {
    margin-top: 10px;
  }
}

.example-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.landing-feature-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.landing-feature-note {
  margin-top: 12px;
  margin-bottom: 0;
  text-align: center;
}

.example-card {
  padding: 18px;
}

.example-card h3 {
  margin-bottom: 8px;
}

.example-card p {
  color: var(--muted);
  line-height: 1.78;
}

.example-card blockquote {
  margin: 14px 0 0;
  border-left: 4px solid var(--primary);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: #f7faf7;
  padding: 13px 14px;
  color: #2f3f36;
  line-height: 1.75;
}

.pricing-card h3,
.faq-card h3,
.test-card h3 {
  margin-bottom: 8px;
}

.pricing-card ul,
.faq-card ul,
.test-card ul {
  margin: 12px 0 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.7;
}

.plan-detail-toggle {
  margin-top: 12px;
  border-top: 1px dashed #d7e2db;
  padding-top: 10px;
}

.plan-detail-toggle summary {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid #cfe0d7;
  border-radius: 999px;
  background: #f7fbf8;
  color: #0d5a49;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
  list-style: none;
}

.plan-detail-toggle summary::-webkit-details-marker {
  display: none;
}

.plan-detail-toggle[open] summary {
  background: #eef7f1;
  border-color: #bdd5c8;
}

.plan-detail-toggle ul {
  margin: 12px 0 0;
  padding-left: 18px;
  color: #3f5148;
  line-height: 1.8;
}

.plan-detail-toggle li {
  margin-bottom: 6px;
}

.plan-detail-toggle li:last-child {
  margin-bottom: 0;
}

.price {
  color: var(--primary-dark);
  font-size: 22px;
  font-weight: 900;
}

.admin-shell {
  padding-bottom: 42px;
}

.admin-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(0, 1.18fr);
  gap: 18px;
  align-items: start;
}

.admin-form,
.admin-list {
  padding: 18px;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.summary-item {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  padding: 12px;
}

.summary-item strong {
  display: block;
  font-size: 22px;
}

.summary-item span {
  color: var(--muted);
  font-size: 13px;
}

.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
  background: #fff;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 12px;
  text-align: left;
  vertical-align: top;
}

th {
  background: #f1f6f2;
  font-size: 14px;
}

tr:last-child td {
  border-bottom: 0;
}

.table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 280px;
}

.member-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.member-card {
  background: #fff;
  border: 1px solid #d7e4db;
  border-radius: var(--radius);
  padding: 14px;
  box-shadow: 0 8px 18px rgba(28, 49, 41, 0.06);
}

.member-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.member-card-title {
  margin: 0;
  font-size: 18px;
  color: var(--primary-dark);
  line-height: 1.35;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.member-card-meta {
  margin: 8px 0 6px;
}

.member-card-row {
  display: flex;
  gap: 8px;
  margin: 6px 0;
  align-items: baseline;
}

.member-card-row strong {
  min-width: 74px;
  color: #355246;
  font-weight: 800;
}

.member-card-row span {
  color: #223c33;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.member-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}

.status-badge {
  font-weight: 800;
  white-space: nowrap;
}

.feedback-unread-notice {
  border: 1px solid #d7e4db;
  background: #f7fbf8;
  border-radius: var(--radius);
  padding: 10px 12px;
  min-width: 220px;
}

.feedback-unread-notice strong {
  display: block;
  color: #184b3d;
  margin-bottom: 4px;
}

.feedback-unread-notice p {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 13px;
}

.admin-alert-list {
  display: grid;
  gap: 8px;
}

.admin-alert-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 8px;
  align-items: center;
  border: 1px solid #d7e4db;
  background: #fbfdfb;
  border-radius: var(--radius);
  padding: 10px 12px;
}

.admin-alert-icon {
  font-size: 16px;
}

.admin-alert-content {
  color: #234438;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.admin-alert-action {
  white-space: nowrap;
}

.admin-alert-empty {
  border: 1px dashed #d7e4db;
  background: #f8fbf9;
  border-radius: var(--radius);
  padding: 12px;
  color: var(--muted);
}

.renew-notice .quick-actions {
  align-items: flex-start;
}

.renew-notice p {
  margin-bottom: 10px;
}

.renew-actions {
  justify-content: flex-end;
  gap: 10px;
}

.inline-details {
  display: inline-block;
}

.inline-details > summary {
  list-style: none;
}

.inline-details > summary::-webkit-details-marker {
  display: none;
}

.inline-details-body {
  margin-top: 8px;
  border: 1px solid #d7e4db;
  background: #fffdf8;
  border-radius: var(--radius);
  padding: 10px 12px;
  max-width: 680px;
}

.pricing-detail-body {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
}

.pricing-mini-card {
  border: 1px solid #d8e7dd;
  border-radius: 12px;
  padding: 10px;
  background: #fff;
}

.pricing-mini-card h4 {
  margin: 0 0 6px;
  font-size: 14px;
  color: #1e4b3d;
}

.pricing-mini-card p {
  margin: 0 0 8px;
  color: #4b5e55;
  font-size: 13px;
}

.pricing-mini-card ul {
  margin: 0;
  padding-left: 18px;
}

.pricing-mini-card li {
  margin: 0 0 4px;
  color: #2a3c33;
  font-size: 13px;
}

.pricing-mini-recommend {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed #d8e7dd;
  font-size: 13px;
  color: #3d5147;
  line-height: 1.6;
}

.pricing-extra-note {
  grid-column: 1 / -1;
  border: 1px solid #d7e4db;
  background: #f8fbf9;
  border-radius: 12px;
  padding: 10px 12px;
  color: #2f4339;
  font-size: 13px;
  line-height: 1.65;
}

.message-box {
  border: 1px solid #d7e4db;
  background: #f8fbf9;
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
}

.message-box strong {
  display: block;
  color: #1e4b3d;
  margin-bottom: 6px;
}

.message-example,
.account-help {
  color: #4b5e55;
  font-size: 13px;
}

.principle-banner-wrap {
  max-width: 980px;
  margin: 0 auto;
}

.principle-banner-image {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  border: 1px solid #d7e4db;
}

/* ?占쎌젣 ?占쏙옙? ?占쎌슜 ?占쎌씠吏???占쏙옙?吏???占쎌튃 諛곕꼫??移대뱶 ?占쏀띁占?理쒖냼?占쏀빐 諛곕꼫占?蹂댁씠占??占쎈━ */
.section-anchor#principle:has(.principle-banner-wrap) {
  padding-top: 16px;
  padding-bottom: 22px;
}

.principle:has(.principle-banner-wrap) {
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
  isolation: auto;
}

.principle:has(.principle-banner-wrap) .principle-content {
  padding: 0;
}

.principle:has(.principle-banner-wrap) .principle-banner-wrap {
  max-width: 920px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  overflow: hidden;
  border-radius: 18px;
}

.principle:has(.principle-banner-wrap) .principle-banner-image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center top;
  border: 0;
  border-radius: 18px;
}

.inline-details-body p {
  margin: 0 0 8px;
}

.inline-details-body p:last-child {
  margin-bottom: 0;
}

.account-box {
  border: 1px solid #c9ddcf;
  background: #f4faf6;
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
}

.account-box strong {
  display: block;
  color: #1e4b3d;
  margin-bottom: 6px;
}

.account-bank {
  font-weight: 900;
  color: #0f3c30;
  font-size: 15px;
}

.code-text {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 800;
}

.empty-state {
  padding: 24px;
  color: var(--muted);
  text-align: center;
}

.footer-note {
  padding: 28px 0 46px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.75;
  text-align: center;
}

.footer-note p {
  margin-bottom: 10px;
}

.footer-note .footer-message {
  max-width: 820px;
  margin: 0 auto;
}

.service-intro-copy p,
.pricing-intro,
.benefit-note p,
.faq-intro,
.cta-copy p,
.footer-note p,
.section-head .text-measure {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.why-card-grid {
  margin-top: 22px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.why-card-image {
  width: 100%;
  max-width: 360px;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 18px;
  box-shadow: 0 14px 34px rgba(24, 56, 44, 0.12);
  border: 1px solid #d9e6de;
  background: #ffffff;
}

.why-guide-action {
  margin-top: 18px;
}

.footer-note p:last-child {
  margin-bottom: 0;
}

.copyright {
  color: #4f5d55;
  text-align: center;
  margin-top: 14px;
}

/* Premium 由ы룷???占쏀뵆 ?占쎌씠吏 */
.premium-report-page {
  overflow-x: hidden;
}

.premium-report-page .report-sample-hero {
  padding-top: 8px;
}

.report-sample-hero-card {
  border: 1px solid #d9c39a;
  background: linear-gradient(135deg, #fffef7 0%, #fff6e6 45%, #eefbf2 100%);
  padding: clamp(20px, 3.2vw, 34px);
  border-radius: 22px;
  box-shadow: 0 14px 34px rgba(21, 55, 40, 0.1);
}

.report-sample-eyebrow {
  margin: 0 0 8px;
  color: #6b5425;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.report-sample-hero-card h1 {
  margin: 0;
  font-size: clamp(24px, 3.2vw, 40px);
  color: #0f3e2f;
  line-height: 1.24;
}

.report-sample-hero-copy {
  margin: 14px 0 0;
  color: #34574a;
  font-size: 16px;
  line-height: 1.68;
  max-width: 860px;
}

.report-sample-jump-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.report-sample-jump-actions .btn {
  min-height: 44px;
}

.report-toc-card {
  border: 1px solid #dcc9a6;
  background: linear-gradient(145deg, #fffef9 0%, #fff7ea 100%);
}

.report-toc-head h2 {
  margin: 0;
}

.report-toc-head p {
  margin: 8px 0 0;
  color: #456156;
  line-height: 1.6;
}

.report-toc-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.report-toc-link {
  min-height: 44px;
  border: 1px solid #d8e3d8;
  border-radius: 12px;
  background: #ffffff;
  padding: 10px 12px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 10px rgba(21, 53, 41, 0.05);
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.report-toc-link:hover,
.report-toc-link:focus-visible {
  transform: translateY(-1px);
  background: #f7fcf8;
  border-color: #c8ddcf;
}

.report-toc-link:focus-visible {
  outline: 2px solid #1f7a59;
  outline-offset: 2px;
}

.report-toc-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: #0e694a;
  color: #f7f2e0;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  flex-shrink: 0;
}

.report-toc-title {
  color: #194737;
  font-weight: 700;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.report-section-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fffefb;
  padding: 20px 22px;
  margin-bottom: 12px;
  box-shadow: 0 10px 24px rgba(23, 52, 41, 0.07);
}

.report-section-card h2 {
  margin: 0 0 14px;
  font-size: 22px;
  color: #114534;
}

.report-section-title-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
}

.report-section-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 34px;
  padding: 0 10px;
  border-radius: 10px;
  background: #0e694a;
  color: #f9f3e5;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  box-shadow: 0 4px 10px rgba(14, 105, 74, 0.2);
}

.report-section-title-copy {
  flex: 1;
  min-width: 0;
}

.report-section-title-copy h2 {
  margin: 0;
}

.report-section-title-copy p {
  margin: 8px 0 0;
}

.report-standard-section .report-section-card p {
  margin: 0;
  color: #35574b;
  line-height: 1.72;
}

.report-standard-section .report-section-card p + p {
  margin-top: 10px;
}

.report-summary-meta-card h2,
.report-kpi-section-card h2 {
  margin-bottom: 16px;
}

.report-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.report-meta-item {
  border: 1px solid #dfd7c7;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffefb 0%, #fffaf0 100%);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.report-meta-item span {
  font-size: 12px;
  color: #6e725f;
  font-weight: 700;
}

.report-meta-item strong {
  font-size: 18px;
  color: #114534;
  line-height: 1.35;
}

.report-meta-note {
  margin-top: 14px !important;
}

.report-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.report-kpi-item {
  border: 1px solid #d8e4d8;
  border-radius: 14px;
  background: #ffffff;
  padding: 14px;
  box-shadow: 0 4px 12px rgba(17, 69, 52, 0.06);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.report-kpi-label {
  font-size: 12px;
  color: #5c6f65;
  font-weight: 700;
}

.report-kpi-value {
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.2;
  color: #0f4533;
  font-weight: 800;
}

.report-kpi-sub {
  font-size: 13px;
  color: #8a6420;
  font-weight: 700;
}

.report-insight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.report-insight-item {
  border: 1px solid #dbe7dc;
  border-radius: 14px;
  background: #ffffff;
  padding: 14px;
}

.report-insight-item h3 {
  margin: 0 0 8px;
  font-size: 18px;
  color: #154635;
}

.report-insight-item p {
  margin: 0;
  color: #35574b;
  line-height: 1.65;
}

.report-emotion-top-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.report-emotion-pill,
.report-emotion-highlight {
  border-radius: 14px;
  padding: 12px;
  border: 1px solid #d9e6da;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.report-emotion-pill span,
.report-emotion-highlight span {
  font-size: 12px;
  color: #607165;
  font-weight: 700;
}

.report-emotion-pill strong,
.report-emotion-highlight strong {
  font-size: 30px;
  line-height: 1.2;
  color: #114534;
}

.report-emotion-highlight strong {
  font-size: 24px;
}

.report-emotion-pill em,
.report-emotion-highlight em {
  font-style: normal;
  color: #8a6420;
  font-size: 12px;
  font-weight: 700;
}

.report-emotion-pill.positive {
  background: #f4fbf6;
}

.report-emotion-pill.neutral {
  background: #fff9ec;
}

.report-emotion-pill.negative {
  background: #f8f3ef;
}

.report-emotion-highlight.improve {
  background: #f2faf5;
}

.report-emotion-highlight.caution {
  background: #fff6ee;
}

.report-emotion-bars {
  border: 1px solid #dfdfd3;
  border-radius: 14px;
  padding: 12px;
  background: #fffefb;
}

.report-emotion-bar-row {
  display: grid;
  grid-template-columns: 56px 1fr 44px;
  align-items: center;
  gap: 10px;
}

.report-emotion-bar-row + .report-emotion-bar-row {
  margin-top: 10px;
}

.report-emotion-bar-row .label,
.report-emotion-bar-row .value {
  font-size: 13px;
  color: #204739;
  font-weight: 700;
}

.bar-track {
  height: 10px;
  border-radius: 999px;
  background: #e9ece5;
  overflow: hidden;
}

.bar {
  display: block;
  height: 100%;
  border-radius: 999px;
}

.bar.positive {
  background: linear-gradient(90deg, #0f7a54 0%, #0d5d44 100%);
}

.bar.neutral {
  background: linear-gradient(90deg, #daa83a 0%, #ba8728 100%);
}

.bar.negative {
  background: linear-gradient(90deg, #8f9690 0%, #6f7771 100%);
}

.report-emotion-actions {
  margin-top: 12px;
  border: 1px solid #dfd7c7;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
}

.report-emotion-actions h3 {
  margin: 0 0 8px;
  color: #114534;
  font-size: 18px;
}

.report-emotion-actions ul {
  margin: 0;
  padding-left: 18px;
}

.report-emotion-actions li {
  color: #33574a;
  line-height: 1.6;
}

.report-emotion-actions li + li {
  margin-top: 6px;
}

.report-satisfaction-sub {
  margin: 0 0 14px !important;
  color: #35574b;
}

.report-satisfaction-top5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.sat-rank-card {
  border: 1px solid #d8dfd2;
  border-radius: 14px;
  padding: 12px;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.rank-badge {
  align-self: flex-start;
  background: #0d6a4b;
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 800;
}

.sat-rank-card strong {
  color: #124835;
  font-size: 24px;
  line-height: 1.25;
}

.sat-rank-card em {
  font-style: normal;
  color: #8a6420;
  font-weight: 700;
}

.report-satisfaction-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 12px;
}

.sat-panel {
  border: 1px solid #dfd7c8;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
}

.sat-panel h3 {
  margin: 0 0 10px;
  color: #124835;
}

.sat-extra-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sat-extra-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px dashed #e1dfd0;
  padding: 8px 0;
  color: #2f5649;
}

.sat-extra-list li:last-child {
  border-bottom: none;
}

.sat-extra-list strong {
  color: #7f5c1d;
}

.sat-point-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.sat-point-grid span {
  border: 1px solid #dce5da;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  color: #194737;
  font-weight: 700;
  text-align: center;
}

.sat-action-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.sat-action-card {
  border: 1px solid #dbdfd2;
  border-radius: 14px;
  background: #fff;
  padding: 14px;
}

.sat-action-card h3 {
  margin: 0 0 8px;
  font-size: 19px;
  color: #124835;
  line-height: 1.4;
}

.sat-action-card p {
  margin: 0;
  color: #35574b;
  line-height: 1.6;
}

.report-improvement-sub {
  margin: 0 0 14px !important;
  color: #35574b;
}

.report-improvement-top-grid,
.report-improvement-mid-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.report-improvement-mid-grid {
  margin-top: 12px;
}

.improve-panel {
  border: 1px solid #ddd8cc;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
}

.improve-panel h3 {
  margin: 0 0 10px;
  color: #124835;
  font-size: 20px;
}

.improve-rank-list,
.improve-cause-list,
.improve-risk-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.improve-rank-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px dashed #e3dfd2;
  color: #2f5649;
}

.improve-rank-list li:last-child {
  border-bottom: none;
}

.improve-rank-list strong {
  color: #875f1a;
}

.improve-cause-list li {
  padding: 8px 0;
  border-bottom: 1px dashed #e3dfd2;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.improve-cause-list li:last-child {
  border-bottom: none;
}

.improve-cause-list strong {
  color: #1d4838;
}

.improve-cause-list span {
  color: #3c5a4f;
  line-height: 1.55;
}

.soft-risk-panel {
  background: linear-gradient(180deg, #fffef9 0%, #fff8ef 100%);
}

.improve-risk-list li {
  color: #36564b;
  line-height: 1.6;
}

.improve-risk-list li + li {
  margin-top: 6px;
}

.improve-priority-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.improve-priority-list li {
  border: 1px solid #dce5d7;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.improve-priority-list .num {
  display: inline-flex;
  min-width: 52px;
  min-height: 32px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  background: #0d6a4b;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.improve-priority-list strong {
  color: #174836;
}

.improve-table-panel {
  margin-top: 12px;
}

.improve-table-wrap {
  overflow-x: auto;
}

.improve-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #dfd8c8;
  border-radius: 10px;
  overflow: hidden;
}

.improve-table th,
.improve-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid #ebe6da;
  color: #2f5649;
}

.improve-table tr:last-child td {
  border-bottom: none;
}

.improve-table th {
  background: #f1f7f1;
  color: #164c38;
  font-size: 14px;
}

.report-comic-sub {
  margin: 0;
  color: #35574b;
  line-height: 1.65;
}

.report-comic-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.report-comic-card {
  border: 1px solid #dfe4d8;
  border-radius: 16px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(23, 52, 41, 0.06);
}

.report-comic-label {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #eaf8ef;
  border: 1px solid #cde8d9;
  color: #116446;
  font-size: 12px;
  font-weight: 800;
}

.report-comic-card h3 {
  margin: 10px 0;
  color: #144635;
  font-size: 22px;
  line-height: 1.35;
}

.report-comic-figure {
  margin: 0;
  border: 1px solid #e5dece;
  border-radius: 12px;
  padding: 8px;
  background: #fff;
}

.report-comic-figure img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  border-radius: 8px;
}

.report-comic-image-link {
  display: block;
  border-radius: 8px;
}

.report-comic-image-link:focus-visible {
  outline: 2px solid #1f7a59;
  outline-offset: 2px;
}

.report-comic-open-link {
  margin-top: 10px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  color: #0c7a55;
  font-weight: 700;
  text-decoration: none;
}

.report-comic-open-link:hover,
.report-comic-open-link:focus-visible {
  text-decoration: underline;
}

.report-comic-tap-hint {
  margin: 8px 2px 0;
  font-size: 12px;
  color: #6d7d75;
}

.report-comic-note {
  margin-top: 14px;
  border: 1px solid #e1d7c7;
  border-radius: 12px;
  background: linear-gradient(140deg, #fffdf8 0%, #fff8eb 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.65;
}

.report-comic-cta-row {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.report-comic-cta-row .btn {
  min-height: 44px;
}

.report-menu-sub {
  margin: 0 0 14px !important;
  color: #35574b;
}

.report-menu-highlight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.menu-highlight-card {
  border: 1px solid #d9dfd3;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
}

.menu-highlight-label {
  font-size: 12px;
  color: #5c6f65;
  font-weight: 700;
}

.menu-highlight-card h3 {
  margin: 8px 0 6px;
  color: #144635;
  font-size: 30px;
  line-height: 1.2;
}

.menu-highlight-card p {
  margin: 0;
  color: #8a6420;
  font-weight: 700;
}

.report-menu-table-panel {
  margin-top: 12px;
}

.report-menu-table-panel h3,
.menu-combo-card h3,
.menu-action-card h3 {
  margin: 0 0 10px;
  color: #124835;
}

.report-menu-table-wrap {
  border: 1px solid #dfd8c8;
  border-radius: 12px;
  overflow: hidden;
}

.report-menu-table {
  width: 100%;
  border-collapse: collapse;
}

.report-menu-table th,
.report-menu-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid #ece6da;
  color: #2f5649;
}

.report-menu-table tr:last-child td {
  border-bottom: none;
}

.report-menu-table th {
  background: #f1f7f1;
  color: #164c38;
  font-size: 14px;
}

.report-menu-point-grid,
.report-menu-combo-grid,
.report-menu-action-grid {
  margin-top: 12px;
  display: grid;
  gap: 12px;
}

.report-menu-point-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-menu-combo-grid,
.report-menu-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.menu-point-card,
.menu-combo-card,
.menu-action-card {
  border: 1px solid #ddd8cc;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
  color: #35574b;
  line-height: 1.6;
}

.menu-combo-card p,
.menu-action-card p {
  margin: 0;
}

.report-delivery-sub {
  margin: 0 0 14px !important;
  color: #35574b;
}

.report-delivery-score-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.delivery-score-card {
  border: 1px solid #d9dfd3;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.delivery-score-card span {
  font-size: 12px;
  color: #5c6f65;
  font-weight: 700;
}

.delivery-score-card strong {
  color: #124835;
  font-size: 30px;
  line-height: 1.2;
}

.delivery-score-card em {
  font-style: normal;
  color: #8a6420;
  font-weight: 700;
  font-size: 13px;
}

.report-delivery-ratio-grid,
.report-delivery-feedback-grid,
.report-delivery-action-grid {
  margin-top: 12px;
  display: grid;
  gap: 12px;
}

.report-delivery-ratio-grid,
.report-delivery-feedback-grid {
  grid-template-columns: 1fr 1fr;
}

.report-delivery-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.delivery-ratio-card,
.delivery-good-panel,
.delivery-issue-panel,
.delivery-action-card {
  border: 1px solid #ddd8cc;
  border-radius: 14px;
  background: #fffef9;
  padding: 14px;
}

.delivery-ratio-card h3,
.delivery-good-panel h3,
.delivery-issue-panel h3,
.delivery-action-card h3 {
  margin: 0 0 10px;
  color: #124835;
}

.delivery-ratio-card ul,
.delivery-good-panel ul,
.delivery-issue-panel ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.delivery-ratio-card li {
  display: grid;
  grid-template-columns: 72px 1fr 38px;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
}

.delivery-ratio-card li span {
  color: #33574b;
  font-size: 13px;
}

.delivery-ratio-card li strong {
  color: #204739;
  font-size: 13px;
}

.delivery-ratio-bar {
  height: 10px;
  border-radius: 999px;
  background: #e8ece4;
  overflow: hidden;
}

.delivery-ratio-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #0e7753 0%, #0c5a42 100%);
}

.report-delivery-timeline {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.delivery-time-card {
  border: 1px solid #dbe5d7;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.delivery-time-card span {
  color: #4b655b;
  font-size: 12px;
  font-weight: 700;
}

.delivery-time-card strong {
  color: #174836;
}

.delivery-time-card.caution {
  background: #fff6ee;
  border-color: #edd9be;
}

.delivery-time-card.mild {
  background: #fffaf2;
  border-color: #e9dcc7;
}

.delivery-good-panel ul li,
.delivery-issue-panel ul li {
  color: #35574b;
  line-height: 1.6;
}

.delivery-good-panel ul li + li,
.delivery-issue-panel ul li + li {
  margin-top: 6px;
}

.delivery-issue-panel {
  background: linear-gradient(180deg, #fffef9 0%, #fff9f2 100%);
}

.delivery-action-card p {
  margin: 0;
  color: #35574b;
  line-height: 1.6;
}

.delivery-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
}

.report-customer-type-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffbf3 100%);
}

.report-customer-type-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-customer-type-kpi-grid,
.report-customer-type-grid,
.report-customer-type-feedback-grid,
.report-customer-type-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-customer-type-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-customer-type-grid,
.report-customer-type-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-customer-type-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-type-kpi-card,
.customer-type-panel,
.customer-type-good-panel,
.customer-type-issue-panel,
.customer-type-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.customer-type-kpi-card span,
.customer-type-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.customer-type-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.customer-type-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.customer-type-panel h3,
.customer-type-good-panel h3,
.customer-type-issue-panel h3,
.customer-type-action-card h3,
.report-customer-type-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.customer-type-panel ul,
.customer-type-good-panel ul,
.customer-type-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.customer-type-panel li {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  gap: 10px;
  align-items: center;
}

.customer-type-panel li + li,
.customer-type-good-panel li + li,
.customer-type-issue-panel li + li {
  margin-top: 10px;
}

.customer-type-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
}

.customer-type-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.customer-type-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.customer-type-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.customer-type-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.customer-type-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.45;
  word-break: keep-all;
}

.customer-type-good-panel li,
.customer-type-issue-panel li,
.customer-type-action-card p {
  color: #35584b;
  line-height: 1.6;
  word-break: keep-all;
}

.customer-type-action-card p {
  margin: 0;
}

.report-customer-type-action-title {
  margin-top: 16px;
}

.customer-type-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-reorder-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffaf2 100%);
}

.report-reorder-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-reorder-kpi-grid,
.report-reorder-grid,
.report-reorder-feedback-grid,
.report-reorder-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-reorder-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-reorder-grid,
.report-reorder-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-reorder-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.reorder-kpi-card,
.reorder-panel,
.reorder-good-panel,
.reorder-issue-panel,
.reorder-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.reorder-kpi-card span,
.reorder-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.reorder-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.reorder-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.reorder-panel h3,
.reorder-good-panel h3,
.reorder-issue-panel h3,
.reorder-action-card h3,
.report-reorder-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.reorder-panel ul,
.reorder-good-panel ul,
.reorder-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.reorder-panel li {
  display: grid;
  grid-template-columns: minmax(150px, 180px) 1fr 52px;
  gap: 10px;
  align-items: center;
}

.reorder-panel li span {
  min-width: 0;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: normal;
  white-space: nowrap;
}

.reorder-panel li + li,
.reorder-good-panel li + li,
.reorder-issue-panel li + li {
  margin-top: 10px;
}

.reorder-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
  justify-self: end;
}

.reorder-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.reorder-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.reorder-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.reorder-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.reorder-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.45;
  word-break: keep-all;
}

.reorder-good-panel li,
.reorder-issue-panel li,
.reorder-action-card p {
  color: #35584b;
  line-height: 1.6;
  word-break: keep-all;
}

.reorder-action-card p {
  margin: 0;
}

.report-reorder-action-title {
  margin-top: 16px;
}

.reorder-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-improvement-proposal-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffaf3 100%);
}

.report-improvement-proposal-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-improvement-proposal-kpi-grid,
.report-improvement-proposal-grid,
.report-improvement-proposal-feedback-grid,
.report-improvement-proposal-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-improvement-proposal-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-improvement-proposal-grid,
.report-improvement-proposal-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-improvement-proposal-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.improvement-proposal-kpi-card,
.improvement-proposal-panel,
.improvement-proposal-good-panel,
.improvement-proposal-issue-panel,
.improvement-proposal-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.improvement-proposal-kpi-card span,
.improvement-proposal-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.improvement-proposal-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.improvement-proposal-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.improvement-proposal-panel h3,
.improvement-proposal-good-panel h3,
.improvement-proposal-issue-panel h3,
.improvement-proposal-action-card h3,
.report-improvement-proposal-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.improvement-proposal-panel ul,
.improvement-proposal-good-panel ul,
.improvement-proposal-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.improvement-proposal-panel li {
  display: grid;
  grid-template-columns: 92px 1fr auto;
  gap: 10px;
  align-items: center;
}

.improvement-proposal-panel li + li,
.improvement-proposal-good-panel li + li,
.improvement-proposal-issue-panel li + li {
  margin-top: 10px;
}

.improvement-proposal-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
}

.improvement-proposal-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.improvement-proposal-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.improvement-proposal-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.improvement-proposal-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.improvement-proposal-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.45;
  word-break: keep-all;
}

.improvement-proposal-good-panel li,
.improvement-proposal-issue-panel li,
.improvement-proposal-action-card p {
  color: #35584b;
  line-height: 1.6;
  word-break: keep-all;
}

.improvement-proposal-action-card p {
  margin: 0;
}

.report-improvement-proposal-action-title {
  margin-top: 16px;
}

.improvement-proposal-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-marketing-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffaf3 100%);
}

.report-marketing-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-marketing-kpi-grid,
.report-marketing-grid,
.report-marketing-feedback-grid,
.report-marketing-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-marketing-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-marketing-grid,
.report-marketing-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-marketing-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.marketing-kpi-card,
.marketing-panel,
.marketing-good-panel,
.marketing-issue-panel,
.marketing-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.marketing-kpi-card span,
.marketing-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.marketing-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.marketing-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.marketing-panel h3,
.marketing-good-panel h3,
.marketing-issue-panel h3,
.marketing-action-card h3,
.report-marketing-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.marketing-panel ul,
.marketing-good-panel ul,
.marketing-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.marketing-panel li {
  display: grid;
  grid-template-columns: minmax(160px, 190px) 1fr 52px;
  gap: 10px;
  align-items: center;
}

.marketing-panel li span {
  min-width: 0;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: normal;
  white-space: nowrap;
}

.marketing-panel li + li,
.marketing-good-panel li + li,
.marketing-issue-panel li + li {
  margin-top: 10px;
}

.marketing-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
  justify-self: end;
}

.marketing-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.marketing-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.marketing-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.marketing-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.marketing-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.45;
  word-break: keep-all;
}

.marketing-good-panel li,
.marketing-issue-panel li,
.marketing-action-card p {
  color: #35584b;
  line-height: 1.6;
  word-break: keep-all;
}

.marketing-action-card p {
  margin: 0;
}

.report-marketing-action-title {
  margin-top: 16px;
}

.marketing-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-next-goal-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffaf3 100%);
}

.report-next-goal-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-next-goal-kpi-grid,
.report-next-goal-grid,
.report-next-goal-feedback-grid,
.report-next-goal-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-next-goal-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-next-goal-grid,
.report-next-goal-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-next-goal-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.next-goal-kpi-card,
.next-goal-panel,
.next-goal-good-panel,
.next-goal-issue-panel,
.next-goal-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.next-goal-kpi-card span,
.next-goal-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.next-goal-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.next-goal-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.next-goal-panel h3,
.next-goal-good-panel h3,
.next-goal-issue-panel h3,
.next-goal-action-card h3,
.report-next-goal-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.next-goal-panel ul,
.next-goal-good-panel ul,
.next-goal-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.next-goal-panel li {
  display: grid;
  grid-template-columns: minmax(160px, 190px) 1fr 52px;
  gap: 10px;
  align-items: center;
}

.next-goal-panel li span {
  min-width: 0;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: normal;
  white-space: nowrap;
}

.next-goal-panel li + li,
.next-goal-good-panel li + li,
.next-goal-issue-panel li + li {
  margin-top: 10px;
}

.next-goal-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
  justify-self: end;
}

.next-goal-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.next-goal-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.next-goal-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.next-goal-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.next-goal-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.45;
  word-break: keep-all;
}

.next-goal-good-panel li,
.next-goal-issue-panel li,
.next-goal-action-card p {
  color: #35584b;
  line-height: 1.6;
  word-break: keep-all;
}

.next-goal-action-card p {
  margin: 0;
}

.report-next-goal-action-title {
  margin-top: 16px;
}

.next-goal-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-appendix-section-card {
  background: linear-gradient(180deg, #fffef9 0%, #fffaf3 100%);
}

.report-appendix-sub {
  margin: 6px 0 0;
  color: #4f6a60;
  line-height: 1.55;
}

.report-appendix-kpi-grid,
.report-appendix-grid,
.report-appendix-feedback-grid,
.report-appendix-action-grid {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-appendix-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-appendix-grid,
.report-appendix-feedback-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.report-appendix-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.appendix-kpi-card,
.appendix-panel,
.appendix-good-panel,
.appendix-issue-panel,
.appendix-action-card {
  min-width: 0;
  border: 1px solid #e2d8c8;
  border-radius: 14px;
  background: #fffefb;
  padding: 18px;
  box-shadow: 0 8px 20px rgba(25, 49, 39, 0.05);
}

.report-appendix-section-card p,
.report-appendix-section-card li,
.report-appendix-section-card strong,
.report-appendix-section-card span {
  word-break: keep-all;
  overflow-wrap: break-word;
}

.appendix-kpi-card span,
.appendix-focus-card span {
  display: block;
  color: #5f7d71;
  font-size: 13px;
  word-break: keep-all;
}

.appendix-kpi-card strong {
  display: block;
  margin-top: 6px;
  color: #174838;
  font-size: 24px;
  line-height: 1.2;
  word-break: keep-all;
}

.appendix-kpi-card em {
  display: block;
  margin-top: 6px;
  color: #2e7b5e;
  font-style: normal;
  font-size: 13px;
  word-break: keep-all;
}

.appendix-panel h3,
.appendix-good-panel h3,
.appendix-issue-panel h3,
.appendix-action-card h3,
.report-appendix-action-title {
  margin: 0 0 10px;
  color: #184537;
  font-size: 16px;
  line-height: 1.4;
  word-break: keep-all;
}

.appendix-panel ul,
.appendix-good-panel ul,
.appendix-issue-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.appendix-panel li {
  display: grid;
  grid-template-columns: minmax(160px, 180px) 1fr 52px;
  gap: 16px;
  align-items: center;
}

.appendix-panel li span {
  min-width: 0;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: break-word;
  white-space: nowrap;
}

.appendix-panel li + li,
.appendix-good-panel li + li,
.appendix-issue-panel li + li {
  margin-top: 10px;
}

.appendix-panel li strong {
  color: #1b4a3b;
  font-size: 13px;
  white-space: nowrap;
  justify-self: end;
  text-align: right;
}

.appendix-bar {
  position: relative;
  height: 9px;
  border-radius: 999px;
  background: #edf4ef;
  overflow: hidden;
}

.appendix-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #2f8e68 0%, #64b688 100%);
}

.appendix-focus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.appendix-focus-card {
  min-width: 0;
  border: 1px solid #e4ddcf;
  border-radius: 12px;
  background: #fffaf1;
  padding: 10px;
}

.appendix-focus-card strong {
  display: block;
  margin-top: 6px;
  color: #2f4e43;
  font-size: 14px;
  line-height: 1.6;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.appendix-good-panel li,
.appendix-issue-panel li,
.appendix-action-card p {
  color: #35584b;
  line-height: 1.75;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.appendix-good-panel ul,
.appendix-issue-panel ul {
  display: grid;
  gap: 12px;
}

.appendix-action-card p {
  margin: 0;
}

.report-appendix-action-title {
  margin-top: 16px;
}

.appendix-tip-box {
  margin-top: 12px;
  border: 1px solid #e2d8c8;
  border-radius: 12px;
  background: linear-gradient(130deg, #fffdf8 0%, #fff7ea 100%);
  padding: 12px 14px;
  color: #3f584d;
  line-height: 1.55;
  word-break: keep-all;
}

.report-gallery-head {
  background: linear-gradient(160deg, #fffdfa 0%, #f3faf5 100%);
}

.report-sample-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.report-sample-card {
  border: 1px solid #dfe8df;
  border-radius: 16px;
  background: #ffffff;
  padding: 14px;
  box-shadow: 0 8px 22px rgba(22, 47, 37, 0.07);
}

.report-sample-card-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 10px;
}

.report-sample-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  min-height: 34px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e9f7ee;
  border: 1px solid #c5e6d3;
  color: #116446;
  font-size: 12px;
  font-weight: 800;
}

.report-sample-card h3 {
  margin: 0;
  color: #154334;
  font-size: 17px;
  line-height: 1.45;
}

.report-sample-figure {
  margin: 0;
  background: #fffefb;
  border: 1px solid #e9e3d5;
  border-radius: 12px;
  padding: 10px;
}

.report-sample-figure img {
  width: 100%;
  height: clamp(280px, 44vw, 620px);
  display: block;
  object-fit: contain;
}

.report-sample-open-link {
  display: inline-flex;
  margin-top: 10px;
  min-height: 44px;
  align-items: center;
  color: #0c7a55;
  font-weight: 700;
  text-decoration: none;
}

.report-sample-open-link:hover,
.report-sample-open-link:focus-visible {
  text-decoration: underline;
}

.report-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.report-cta-row .btn {
  min-height: 44px;
}

@media print {
  @page {
    size: A4;
    margin: 10mm;
  }

  html,
  body {
    background: #fff !important;
    color: #111 !important;
  }

  body {
    font-size: 11pt;
    line-height: 1.48;
  }

  .page.guide-page {
    min-height: auto;
  }

  .hero,
  .top-nav,
  .nav-actions,
  .guide-toc-mobile,
  #guide-toc,
  .cta-band,
  .quick-actions,
  .result-toolbar,
  .test-grid,
  .footer-note,
  #printGuideBtn {
    display: none !important;
  }

  .section {
    padding: 6px 0 !important;
  }

  .wrap {
    width: 100% !important;
    max-width: none !important;
  }

  .card,
  .guide-card,
  .guide-mini,
  .faq-card,
  .example-card,
  .pricing-card,
  .guide-hero-card {
    background: #fff !important;
    box-shadow: none !important;
    border: 1px solid #d7d7d7 !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .guide-card,
  .faq-card,
  .example-card,
  .pricing-card {
    padding: 8px !important;
    margin-bottom: 6px !important;
  }

  .guide-mini {
    padding: 8px !important;
    margin-bottom: 6px !important;
  }

  .section-anchor,
  .guide-section {
    break-inside: auto !important;
    page-break-inside: auto !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
  }

  .guide-grid-2,
  .guide-grid-3,
  .faq-grid,
  .example-grid,
  .pricing-grid {
    display: block !important;
    gap: 6px !important;
  }

  .guide-grid-2 > *,
  .guide-grid-3 > *,
  .faq-grid > *,
  .example-grid > *,
  .pricing-grid > * {
    margin: 0 0 6px !important;
  }

  h1,
  h2,
  h3 {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
    line-height: 1.28 !important;
  }

  p,
  li,
  blockquote {
    line-height: 1.45 !important;
    margin-top: 0 !important;
    margin-bottom: 6px !important;
  }

  ul,
  ol {
    margin: 4px 0 6px !important;
  }

  .guide-hero-card {
    padding: 10px !important;
    margin-bottom: 6px !important;
  }

  .guide-page .guide-hero {
    display: block !important;
    padding: 0 0 8px !important;
    margin: 0 0 6px !important;
    break-after: avoid;
    page-break-after: avoid;
  }

  .guide-page .guide-hero .top-nav {
    display: none !important;
  }

  .guide-page .guide-hero-card {
    border: 1px solid #cfcfcf !important;
    background: #fff !important;
    padding: 12px !important;
  }

  .guide-page .guide-hero-card .eyebrow {
    display: inline-block !important;
    margin-bottom: 6px !important;
    padding: 3px 8px !important;
    border: 1px solid #d8d8d8;
    border-radius: 999px;
    background: #fff !important;
    color: #222 !important;
    font-size: 9.5pt !important;
    font-weight: 700;
  }

  .guide-page .guide-hero-card h1 {
    margin: 0 0 6px !important;
    font-size: 19pt !important;
    line-height: 1.28 !important;
    color: #111 !important;
  }

  .guide-page .guide-hero-card .subtitle {
    margin: 0 0 6px !important;
    font-size: 11.5pt !important;
    line-height: 1.45 !important;
    color: #222 !important;
    font-weight: 700;
  }

  .guide-page .guide-hero-card .lead {
    margin: 0 0 5px !important;
    font-size: 10.5pt !important;
    line-height: 1.48 !important;
    color: #222 !important;
  }

  .guide-page .guide-hero-card .guide-core-note {
    margin: 6px 0 0 !important;
    padding: 8px !important;
    border: 1px solid #dddddd !important;
    background: #fff !important;
    color: #222 !important;
    font-size: 10pt !important;
    line-height: 1.45 !important;
  }

  .guide-page .guide-hero-card .print-cover-meta {
    display: block !important;
    margin: 0 0 6px !important;
    font-size: 9pt !important;
    color: #5a5a5a !important;
  }

  .guide-page .guide-hero-card::after {
    content: "由щ럭 ?占쏙옙? ??以꾩뿉??留덉쓬???占쎄만 ???占쎌뒿?占쎈떎. | 怨좉컼???占쎌씠???占쎄뎄媛 ?占쎈땲???占쎌옣?占쎌쓽 留덉쓬???????占쏀븯?占쎈줉 ?占쎈뒗 蹂댁“ ?占쎄뎄?占쎈땲?? | ?占쎌꽦???占쏙옙??占??占쎌옣?占쎌씠 吏곸젒 ?占쎌씤?????占쎌슜?占쎈뒗 寃껋씠 醫뗭뒿?占쎈떎.";
    display: block;
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid #e0e0e0;
    color: #333;
    font-size: 9.2pt;
    line-height: 1.4;
  }

  .guide-core-note,
  .guide-part-intro,
  .guide-read-order,
  .guide-capture-placeholder {
    padding: 8px !important;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }

  .faq-card details,
  details.faq-card {
    display: block !important;
  }

  details,
  details[open] {
    display: block !important;
  }

  details > *,
  details[open] > * {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
  }

  .faq-card summary,
  details.faq-card summary,
  .review-check-detail summary {
    list-style: none;
    display: block !important;
    font-weight: 700;
  }

  .faq-card p,
  details.faq-card p {
    display: block !important;
  }

  details > * {
    display: block !important;
  }

  a,
  a:visited {
    color: #111 !important;
    text-decoration: none !important;
  }

  a[href^="http"]::after {
    content: "" !important;
  }
}

.hidden {
  display: none !important;
}

.plan-annual-benefit-card-v2 {
  margin: 16px 0 20px;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 58%, #ffffff 100%);
  border: 1px solid rgba(16, 185, 129, 0.38);
  box-shadow: 0 10px 24px rgba(15, 118, 110, 0.1);
}

.plan-annual-benefit-badge-v2 {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 11px;
  margin-bottom: 8px;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.16);
  color: #047857;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.2;
}

.plan-annual-benefit-badge-v2::before {
  content: "-";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-right: 6px;
  border-radius: 999px;
  background: #10b981;
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 900;
}

.plan-annual-benefit-saving-v2 {
  display: block;
  margin-top: 8px;
  color: #064e3b;
  font-size: 0.95rem;
  font-weight: 750;
  line-height: 1.55;
  letter-spacing: -0.01em;
}

@media (max-width: 960px) {
  .hero-grid,
  .app-layout,
  .admin-grid,
  .cta-band {
    grid-template-columns: 1fr;
  }

  .sticky-side {
    position: static;
  }

  .tone-dna-panel {
    margin-top: 12px;
  }

  .top-feature-jump {
    grid-template-columns: 1fr;
  }

  .managed-plan-grid {
    grid-template-columns: 1fr;
  }

  .plans-type-grid,
  .plan-card-grid {
    grid-template-columns: 1fr;
  }

  .trial-layout,
  .trial-benefit-grid {
    grid-template-columns: 1fr;
  }

  .landing-trial-layout,
  .landing-trial-benefits {
    grid-template-columns: 1fr;
  }

  .plan-type-card {
    min-height: 0;
  }

  .plan-card {
    padding: 14px;
  }

  .comparison-scroll {
    -webkit-overflow-scrolling: touch;
  }

  .menu-add-row {
    grid-template-columns: 1fr;
  }

  .reply-side-support {
    margin-top: 10px;
  }

  .faq-grid,
  .pricing-grid,
  .example-grid,
  .test-grid,
  .guide-grid-3,
  .guide-toc-list {
    grid-template-columns: 1fr 1fr;
  }

  .analysis-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analysis-content-grid {
    grid-template-columns: 1fr;
  }

  .archive-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .archive-edit-grid {
    grid-template-columns: 1fr;
  }

  .guide-grid-2 {
    grid-template-columns: 1fr;
  }

  .member-card-list {
    grid-template-columns: 1fr;
  }

  .feedback-unread-notice {
    width: 100%;
  }

  .pricing-detail-body {
    grid-template-columns: 1fr;
  }

  .renew-actions {
    justify-content: stretch;
  }

  .admin-alert-item {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .admin-alert-action {
    justify-self: start;
  }
}

@media (max-width: 680px) {
  .wrap {
    width: min(100% - 24px, var(--max));
  }

  .section-description {
    max-width: 100%;
    line-height: 1.72;
  }

  .text-measure,
  .text-measure-wide,
  .principle-body,
  .principle-note {
    max-width: 100%;
  }

  .principle p,
  .principle li,
  .faq-card p,
  .analysis-panel p,
  .example-card p,
  .cta-band p,
  .footer-note p,
  .service-intro-copy p,
  .benefit-note p {
    line-height: 1.72;
  }

  .plan-detail-toggle summary {
    width: 100%;
    justify-content: center;
    min-height: 48px;
  }

  .plan-type-card {
    padding: 18px 16px 16px;
    border-radius: 18px;
  }

  .plan-type-card::before {
    border-radius: 18px 18px 0 0;
  }

  .plan-type-card h3 {
    font-size: 19px;
  }

  .plan-type-card .hint {
    font-size: 14px;
  }

  .plan-detail-toggle ul {
    line-height: 1.72;
  }

  .tone-dna-panel {
    padding: 12px;
  }

  .analysis-summary-grid {
    grid-template-columns: 1fr;
  }

  .archive-summary-grid {
    grid-template-columns: 1fr;
  }

  .review-analysis-head-card,
  .analysis-panel,
  .analysis-empty-card,
  .analysis-link-card {
    padding: 16px;
  }

  .archive-head-card,
  .archive-filter-card,
  .archive-empty-card,
  .archive-review-card {
    padding: 16px;
  }

  .tone-dna-field textarea {
    min-height: 92px;
  }

  .side-mini-card,
  .side-fold-card {
    padding: 11px;
  }

  .side-mini-card h3,
  .side-fold-card > summary {
    font-size: 15px;
  }

  .member-card {
    padding: 12px;
  }

  .member-card-row {
    flex-direction: column;
    gap: 2px;
  }

  .member-card-row strong {
    min-width: 0;
  }

  .member-card-actions .btn {
    min-height: 36px;
  }

  .top-nav,
  .section-head,
  .license-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .nav-actions {
    justify-content: flex-start;
  }

  h1 {
    font-size: 42px;
  }

  .brand {
    gap: 6px;
  }

  .brand-logo-wrap {
    height: 46px;
  }

  .brand-logo {
    height: 46px;
  }

  .header-logo {
    height: 46px;
  }

  .brand-logo-text {
    font-size: 18px;
  }

  .guide-hero .brand-logo-wrap {
    width: auto;
    height: 46px;
  }

  .guide-hero .brand-logo {
    height: 46px;
  }

  .brand-mark-fallback {
    width: 34px;
    height: 34px;
  }

  .brand-calligraphy {
    width: clamp(130px, 42vw, 170px);
    margin-top: 1px;
  }

  .brand-word {
    font-size: clamp(18px, 5.1vw, 21px);
  }

  .principle {
    padding: 0;
    background-size: 100% 100%;
    background-position: center center;
  }

  .hero-calligraphy-wrap {
    margin: 6px 0 10px;
  }

  .hero-calligraphy {
    width: 100%;
    max-width: 100%;
  }

  .hero-grid {
    gap: 24px;
  }

  .hero-copy {
    padding: 16px 0 8px;
  }

  .subtitle {
    font-size: clamp(24px, 7.4vw, 30px);
  }

  .lead {
    font-size: 16px;
    line-height: 1.7;
  }

  .lead-support {
    font-size: 14px;
    line-height: 1.6;
  }

  .point {
    min-height: auto;
    padding: 16px;
    border-radius: 16px;
  }

  .access-panel {
    padding: 22px 18px;
    border-radius: 22px;
  }

  .hero-points,
  .form-grid,
  .faq-grid,
  .pricing-grid,
  .example-grid,
  .test-grid,
  .summary-grid,
  .guide-grid-3,
  .guide-grid-2,
  .guide-toc-list {
    grid-template-columns: 1fr;
  }

  .guide-toc-mobile {
    display: block;
    margin-bottom: 10px;
  }

  .guide-toc > .guide-toc-list {
    display: none;
  }

  .guide-card {
    padding: 16px;
  }

  .guide-service-intro-card {
    padding: 18px;
    border-radius: 18px;
  }

  .guide-service-intro-grid {
    grid-template-columns: 1fr;
  }

  .guide-hero-card {
    padding: 18px;
  }

  .section {
    padding: 44px 0;
  }

  .btn {
    min-height: 54px;
    padding: 13px 16px;
  }

  .reply-actions .btn,
  .quick-actions .btn,
  .nav-actions .btn,
  .result-toolbar .btn,
  .cta-band .btn,
  .feedback-btn {
    width: 100%;
  }

  .feedback-cta {
    padding: 20px 16px;
    border-radius: 18px;
  }

  .option-chip {
    flex: 1 1 calc(50% - 8px);
    justify-content: center;
    text-align: center;
  }

  .option-tooltip {
    left: 6px;
    right: 6px;
    top: calc(100% + 6px);
    font-size: 12px;
    line-height: 1.5;
  }

  .access-panel,
  .form-panel,
  .result-panel,
  .admin-form,
  .admin-list {
    padding: 15px;
  }

  .benefit-actions .btn {
    width: 100%;
  }

  .guide-read-order {
    margin-top: 16px;
    padding: 14px;
  }

  .report-customer-type-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-customer-type-grid,
  .report-customer-type-feedback-grid,
  .report-customer-type-action-grid,
  .customer-type-focus-grid {
    grid-template-columns: 1fr;
  }

  .customer-type-panel li {
    grid-template-columns: 86px 1fr auto;
  }

  .report-reorder-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-reorder-grid,
  .report-reorder-feedback-grid,
  .report-reorder-action-grid,
  .reorder-focus-grid {
    grid-template-columns: 1fr;
  }

  .reorder-panel li {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: stretch;
  }

  .reorder-panel li span {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .reorder-panel li strong {
    justify-self: start;
  }

  .report-improvement-proposal-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-improvement-proposal-grid,
  .report-improvement-proposal-feedback-grid,
  .report-improvement-proposal-action-grid,
  .improvement-proposal-focus-grid {
    grid-template-columns: 1fr;
  }

  .improvement-proposal-panel li {
    grid-template-columns: 90px 1fr auto;
  }

  .report-marketing-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-marketing-grid,
  .report-marketing-feedback-grid,
  .report-marketing-action-grid,
  .marketing-focus-grid {
    grid-template-columns: 1fr;
  }

  .marketing-panel li {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: stretch;
  }

  .marketing-panel li span {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .marketing-panel li strong {
    justify-self: start;
  }

  .report-next-goal-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-next-goal-grid,
  .report-next-goal-feedback-grid,
  .report-next-goal-action-grid,
  .next-goal-focus-grid {
    grid-template-columns: 1fr;
  }

  .next-goal-panel li {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: stretch;
  }

  .next-goal-panel li span {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .next-goal-panel li strong {
    justify-self: start;
  }

  .report-appendix-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-appendix-grid,
  .report-appendix-feedback-grid,
  .report-appendix-action-grid,
  .appendix-focus-grid {
    grid-template-columns: 1fr;
  }

  .appendix-panel li {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: stretch;
  }

  .appendix-panel li span {
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: break-word;
  }

  .appendix-panel li .appendix-bar {
    width: 100%;
  }

  .appendix-panel li strong {
    justify-self: end;
    text-align: right;
  }

  .appendix-good-panel ul,
  .appendix-issue-panel ul {
    gap: 10px;
  }

   .guide-core-note,
   .faq-card,
   .example-card,
   .guide-mini {
     margin-bottom: 2px;
   }
}

/* Plan CTA button enhancements */
.plan-cta {
  font-size: 16px; /* Slightly larger than default small button */
  min-height: 48px; /* Ensure good touch target */
  padding: 12px 20px; /* More padding for better touch area */
  font-weight: 800; /* Ensure bold */
}

/* Hover effect for plan CTA buttons */
.plan-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(31, 42, 36, 0.12);
}

/* Specific styles for different button types if needed */
.plan-cta.ghost {
  border: 1px solid var(--line);
}

.plan-cta.ghost:hover {
  background: #f8f9f8;
}

/* For primary plan CTA buttons if any */
.plan-cta.primary {
  background: var(--primary);
  color: #fff;
}

.plan-cta.primary:hover {
  background: var(--primary-dark);
}

/* For accent plan CTA buttons */
.plan-cta.accent {
  background: var(--accent);
  color: #fff;
}

.plan-cta.accent:hover {
  background: #9f4d2a; /* Darker accent */
}

@media (max-width: 820px) {
  .report-meta-grid {
    grid-template-columns: 1fr;
  }
  .report-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .report-insight-grid {
    grid-template-columns: 1fr;
  }
  .report-toc-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .report-emotion-top-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .report-satisfaction-top5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .report-satisfaction-grid,
  .sat-action-grid {
    grid-template-columns: 1fr;
  }
  .report-improvement-top-grid,
  .report-improvement-mid-grid {
    grid-template-columns: 1fr;
  }
  .report-menu-highlight-grid,
  .report-menu-point-grid,
  .report-menu-combo-grid,
  .report-menu-action-grid {
    grid-template-columns: 1fr;
  }
  .report-delivery-score-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .report-delivery-ratio-grid,
  .report-delivery-feedback-grid,
  .report-delivery-action-grid,
  .report-delivery-timeline {
    grid-template-columns: 1fr;
  }
  .report-comic-grid {
    grid-template-columns: 1fr;
  }
  .report-sample-gallery {
    grid-template-columns: 1fr;
  }
  .report-sample-hero-card {
    border-radius: 18px;
    padding: 18px;
  }
  .landing-proof-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .report-section-title-row {
    gap: 8px;
    margin-bottom: 12px;
  }
  .report-section-number {
    min-width: 40px;
    height: 30px;
    font-size: 12px;
    border-radius: 9px;
    padding: 0 8px;
  }
  .report-section-title-copy p {
    margin-top: 6px;
  }
  .report-sample-jump-actions {
    flex-direction: column;
    align-items: flex-start;
  }
  .report-sample-jump-actions .btn,
  .report-cta-row .btn {
    width: 100%;
  }
  .report-toc-grid {
    grid-template-columns: 1fr;
  }
  .report-toc-link {
    padding: 10px;
  }
  .report-toc-number {
    min-width: 44px;
  }
  .report-kpi-grid {
    grid-template-columns: 1fr;
  }
  .report-emotion-top-grid {
    grid-template-columns: 1fr;
  }
  .report-satisfaction-top5 {
    grid-template-columns: 1fr;
  }
  .sat-point-grid {
    grid-template-columns: 1fr;
  }
  .report-emotion-bar-row {
    grid-template-columns: 44px 1fr 40px;
  }
  .report-comic-cta-row .btn {
    width: 100%;
  }
  .report-delivery-score-grid {
    grid-template-columns: 1fr;
  }
  .delivery-ratio-card li {
    grid-template-columns: 66px 1fr 34px;
  }
  .report-menu-table-wrap {
    overflow: visible;
    border: none;
  }
  .report-menu-table,
  .report-menu-table thead,
  .report-menu-table tbody,
  .report-menu-table tr,
  .report-menu-table th,
  .report-menu-table td {
    display: block;
    width: 100%;
  }
  .report-menu-table thead {
    display: none;
  }
  .report-menu-table tr {
    border: 1px solid #dfd8c8;
    border-radius: 12px;
    background: #fffef9;
    padding: 8px;
    margin-bottom: 8px;
  }
  .report-menu-table td {
    border: none;
    padding: 4px 6px;
  }
  .report-sample-card {
    padding: 12px;
  }
  .landing-proof-grid {
    grid-template-columns: 1fr;
  }
  .landing-proof-click-hint {
    display: none;
  }
.landing-proof-actions .btn {
  width: 100%;
}
}

.report-builder-entry-card .quick-actions {
  gap: 10px;
}

.report-builder-entry-copy,
.report-builder-guide-copy {
  word-break: keep-all;
}

.report-builder-card {
  padding: 16px;
}

.report-builder-base-note {
  margin: 0 0 10px;
  word-break: keep-all;
}

.report-builder-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.report-builder-metric-card {
  padding: 12px;
}

.report-builder-metric-card h3 {
  margin: 0;
  color: #1a473b;
  font-size: 16px;
  word-break: keep-all;
}

.report-builder-metric-card p {
  margin: 8px 0 0;
}

.report-builder-count-line {
  margin: 8px 0 0;
  color: #0f5c48;
  font-weight: 700;
  word-break: keep-all;
}

.report-builder-tab-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.report-builder-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid #cfe0d7;
  background: #ffffff;
  color: #1c473b;
  text-decoration: none;
  font-weight: 700;
}

.report-builder-tab.is-active {
  border-color: #1f7461;
  background: #1f7461;
  color: #ffffff;
}

.report-builder-guide-card {
  padding: 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffefc 0%, #f8fbf8 100%);
}

.report-builder-guide-card h2 {
  color: #0f4f3e;
  margin-top: 0;
}

.report-builder-range-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.report-builder-next-step {
  margin-top: 10px;
}

.report-preview-card {
  margin-top: 14px;
  padding: 16px;
}

.report-preview-copy,
.report-preview-disclaimer,
.report-preview-card p,
.report-preview-card li {
  word-break: keep-all;
}

.report-preview-grid {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.report-preview-mini {
  padding: 14px;
  background: linear-gradient(180deg, #fffefb 0%, #f8fbf7 100%);
}

.report-preview-mini h3 {
  margin-top: 0;
  color: #114c3d;
}

.report-preview-mini ul {
  margin: 0;
  padding-left: 18px;
}

.report-preview-count {
  margin: 0 0 8px;
  color: #0e5b47;
  font-weight: 700;
}

.report-keyword-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 10px;
  margin-top: 8px;
}

.report-keyword-row strong {
  color: #114c3d;
}

.report-keyword-row span {
  color: #46685d;
  font-size: 13px;
}

.report-keyword-bar {
  grid-column: 1 / -1;
  height: 8px;
  border-radius: 999px;
  background: #e4efe9;
  overflow: hidden;
}

.report-keyword-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #1f7c66 0%, #3ba387 100%);
}

.report-need-item {
  padding: 10px;
  border: 1px solid #d8e7df;
  border-radius: 10px;
  background: #ffffff;
  margin-top: 8px;
}

.report-need-item p {
  margin: 0;
}

.report-need-item p + p {
  margin-top: 6px;
}

.report-preview-empty {
  margin-top: 12px;
  padding: 12px;
}

@media (max-width: 760px) {
  .report-builder-metric-grid {
    grid-template-columns: 1fr;
  }

  .report-preview-grid {
    grid-template-columns: 1fr;
  }

  .report-builder-tab {
    width: 100%;
    justify-content: flex-start;
  }

  .report-builder-range-grid {
    grid-template-columns: 1fr;
  }
}

/* plans-v2-20260525 */
.plans-page {
  background: linear-gradient(180deg, #f7faf8 0%, #f5f8f6 45%, #f7f6f1 100%);
}

.plans-page .section {
  padding-top: 30px;
  padding-bottom: 30px;
}

.plans-hero-card {
  padding: 30px;
  border-radius: 24px;
  border: 1px solid #d8e6df;
  background: linear-gradient(140deg, #ffffff 0%, #f7fcfa 58%, #edf7f2 100%);
  box-shadow: 0 16px 36px rgba(14, 38, 31, 0.08);
}

.plans-hero-eyebrow {
  margin: 0 0 8px;
  color: #1f5b4a;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.plans-hero-card h1 {
  margin: 0;
  font-size: clamp(31px, 4vw, 46px);
  line-height: 1.14;
  color: #103f34;
}

.plans-hero-subtitle {
  margin-top: 14px;
  margin-bottom: 10px;
  color: #163f35;
  font-size: clamp(18px, 2.3vw, 24px);
  font-weight: 700;
  line-height: 1.45;
}

.plans-hero-lead {
  margin: 0;
  color: #3a544a;
  line-height: 1.72;
}

.plans-hero-actions {
  margin-top: 16px;
}

.plan-value-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.plan-value-card {
  padding: 16px;
  border-radius: 16px;
  border: 1px solid #dbe7df;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(20, 60, 40, 0.05);
}

.plan-value-card h3 {
  margin: 0 0 6px;
  color: #114436;
  font-size: 18px;
}

.plan-value-card p {
  margin: 0;
  color: #40574f;
  line-height: 1.62;
}

.plan-choice-managed {
  border-color: #dec897;
  background: linear-gradient(145deg, #fffdf7 0%, #f8f1df 100%);
}

.plan-highlight-line {
  margin: 8px 0 6px;
  color: #285648;
  font-weight: 700;
  font-size: 13px;
}

.premium-bridge {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid #dfd2b3;
  background: linear-gradient(140deg, #fffdf8 0%, #f7f1e5 100%);
}

.premium-bridge p {
  margin: 0;
  line-height: 1.68;
  color: #3e4f47;
}

.managed-intro-card {
  padding: 18px;
  border-radius: 20px;
  border: 1px solid #dfcfad;
  background: linear-gradient(145deg, #fffef8 0%, #f7eedf 58%, #efe1c7 100%);
}

.managed-summary-line {
  margin-top: 10px;
  margin-bottom: 6px;
  font-weight: 800;
  color: #7a5b28;
}

.managed-role-badge {
  display: inline-block;
  margin-bottom: 8px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid #d9c39a;
  background: #fff7e7;
  color: #735015;
  font-size: 12px;
  font-weight: 700;
}

.managed-role-badge.manager {
  border-color: #cba75f;
  background: #fbefd3;
  color: #6a470a;
}

.managed-plan-card.managed-plan-manager {
  border-color: #d5b475;
  background: linear-gradient(150deg, #fffdf7 0%, #f7edd7 100%);
  box-shadow: 0 16px 30px rgba(111, 80, 28, 0.12);
}

.managed-core-fold {
  border: 1px solid #deceb0;
  background: #fffef9;
}

.plan-fit-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.plan-fit-list li {
  border: 1px solid #dce7e0;
  border-radius: 12px;
  background: #fff;
  padding: 10px 12px;
}

.plan-fit-list li strong {
  display: block;
  margin-bottom: 4px;
  color: #123f33;
}

.plan-fit-list li span {
  color: #40554d;
  line-height: 1.55;
}

@media (max-width: 1024px) {
  .plan-value-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .plans-page .section {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .plans-hero-card {
    padding: 20px;
    border-radius: 18px;
  }

  .plans-hero-actions .btn {
    width: 100%;
  }

  .plan-value-grid {
    grid-template-columns: 1fr;
  }

  .plan-card-grid,
  .plans-type-grid,
  .managed-plan-grid {
    grid-template-columns: 1fr;
  }

  .plan-card-actions {
    flex-direction: column;
  }

  .plan-card-actions .btn,
  .managed-plan-actions .btn {
    width: 100%;
  }
}
.plans-page .section.plan-flow-tight {
  padding-top: 12px;
  padding-bottom: 12px;
}

.plans-page .section.plan-flow-tight + .section.plan-flow-tight {
  padding-top: 8px;
}

.premium-bridge,
.managed-intro-card {
  margin-top: 0;
  margin-bottom: 0;
}

.managed-plan-section.plan-flow-tight .card {
  margin-top: 0;
}

@media (max-width: 720px) {
  .plans-page .section.plan-flow-tight {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
.posting-help-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-left: 4px solid #c89435;
  border: 1px solid #dfbc72;
  background: linear-gradient(140deg, #fff3dc 0%, #fff0cf 36%, #fff7e8 63%, #ffffff 100%);
  box-shadow: 0 10px 24px rgba(127, 92, 30, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.posting-help-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 88% 12%, rgba(236, 193, 111, 0.24), transparent 44%),
    radial-gradient(circle at 8% 92%, rgba(255, 236, 200, 0.34), transparent 48%);
  z-index: 0;
}

.posting-help-card > * {
  position: relative;
  z-index: 1;
}

.posting-help-badge {
  display: inline-block;
  margin-bottom: 8px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid #e6c681;
  background: #ffefcb;
  color: #6f4a11;
  font-size: 12px;
  font-weight: 700;
}

.posting-help-card h3 {
  color: #2d4a3f;
}

.posting-help-price {
  margin-top: 2px;
  margin-bottom: 4px;
  color: #2f5b4b;
  font-weight: 800;
}

.posting-help-card .hint {
  color: #6f5a30;
}

.posting-help-card .quick-actions .btn.small.primary {
  background: #1f7a5a;
  border-color: #1f7a5a;
}

.posting-help-card #togglePostingGuideBtn {
  border-color: #e1bf75;
  color: #6f4a11;
}

.posting-help-card #togglePostingGuideBtn:hover {
  background: #fff5dd;
  border-color: #d7af59;
}

.posting-help-card .quick-actions .btn.small.primary:hover {
  background: #18684c;
  border-color: #18684c;
}
.quick-compare-cta {
  border: 1px solid #d9e3df;
  background: linear-gradient(140deg, rgba(255,255,255,0.96) 0%, rgba(245,251,248,0.92) 100%);
}

.quick-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.quick-compare-item {
  border: 1px solid #d8e4dc;
  border-radius: 12px;
  background: #ffffff;
  padding: 10px;
}

.quick-compare-label {
  margin: 0 0 8px;
  color: #4b5f56;
  font-size: 13px;
  font-weight: 600;
}

@media (max-width: 720px) {
  .quick-compare-grid {
    grid-template-columns: 1fr;
  }
}