:root {
  --ink: #14243d;
  --muted: #68758a;
  --line: #d9e0e8;
  --paper: #ffffff;
  --soft: #f4f7fa;
  --accent: #1d5c53;
  --accent-strong: #154940;
  --accent-soft: #e8f2ef;
  --warning: #8a4b17;
  --warning-soft: #fff4e7;
  --danger: #8d2f2a;
  --shadow: 0 18px 55px rgba(19, 34, 55, .09);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { background: #eef2f5; color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif; }
body { margin: 0; min-height: 100vh; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .45; }
.shell { width: min(1080px, calc(100% - 32px)); margin: 24px auto; }
.brandbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.brand { display: flex; gap: 12px; align-items: center; color: var(--ink); text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: var(--ink); color: white; font-family: serif; font-size: 20px; }
.brand strong, .brand small { display:block; }
.brand small { color: var(--muted); margin-top: 2px; font-size: 12px; }
.privacy-note { color: var(--muted); font-size: 13px; }
.progress-wrap { display:grid; grid-template-columns: 1fr auto; align-items:center; gap:12px; margin: 10px 0 18px; color:var(--muted); font-size:12px; }
.progress { height:5px; background:#dfe5ea; border-radius:99px; overflow:hidden; }
.progress span { display:block; height:100%; background:var(--accent); transition:width .25s ease; }
.intro-grid { display:grid; grid-template-columns: 1.25fr .75fr; min-height: 650px; background: var(--paper); border: 1px solid var(--line); border-radius: 26px; overflow:hidden; box-shadow:var(--shadow); }
.intro-copy { padding: clamp(40px, 7vw, 90px); align-self:center; }
.section-label { margin:0 0 14px; color:var(--accent); font-size:13px; font-weight:700; letter-spacing:.08em; }
h1 { margin:0; font-family: Georgia, "Yu Mincho", "Hiragino Mincho ProN", serif; font-weight:500; letter-spacing:-.025em; line-height:1.2; font-size:clamp(34px, 5vw, 64px); }
.lead { color:#445267; font-size:18px; line-height:1.85; margin:26px 0; }
.lead.compact { font-size:16px; margin:16px 0 28px; }
.intro-points { list-style:none; padding:0; margin:26px 0 34px; display:grid; gap:12px; color:#3f4c5f; }
.intro-points li::before { content:'—'; color:var(--accent); margin-right:10px; }
.intro-panel { background:var(--ink); color:white; padding:48px 38px; display:flex; flex-direction:column; justify-content:center; gap:0; }
.observation-line { display:grid; grid-template-columns:52px 1fr; align-items:center; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.15); }
.observation-line:last-child { border-bottom:0; }
.observation-line span { color:#91bdb5; font-size:12px; letter-spacing:.12em; }
.observation-line p { margin:0; font-size:17px; }
.primary, .secondary { min-height:48px; padding:0 22px; border-radius:10px; border:1px solid transparent; font-weight:700; letter-spacing:.01em; }
.primary { background:var(--accent); color:white; box-shadow:0 8px 20px rgba(29,92,83,.18); }
.primary:hover { background:var(--accent-strong); }
.primary.large { min-width:220px; min-height:56px; font-size:16px; }
.secondary { background:white; color:var(--ink); border-color:var(--line); }
.micro { color:var(--muted); font-size:12px; line-height:1.7; }
.question-card, .form-card, .message-card { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:clamp(28px, 6vw, 70px); box-shadow:var(--shadow); max-width:820px; margin:0 auto; }
.question-meta { display:flex; justify-content:space-between; color:var(--muted); font-size:13px; margin-bottom:26px; }
.question-card h1 { font-family:inherit; font-weight:700; font-size:clamp(25px, 4vw, 38px); line-height:1.5; }
.answer-list { display:grid; gap:10px; margin:36px 0; }
.answer { display:flex; align-items:center; gap:14px; width:100%; text-align:left; background:white; color:var(--ink); border:1px solid var(--line); border-radius:12px; padding:15px 18px; transition:.15s ease; }
.answer span { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--soft); color:var(--muted); font-size:12px; }
.answer:hover, .answer.selected { border-color:var(--accent); background:var(--accent-soft); transform:translateY(-1px); }
.answer.selected span { background:var(--accent); color:white; }
.answer.muted { color:var(--muted); }
.nav-row { display:flex; justify-content:space-between; gap:12px; margin-top:28px; }
.field { display:grid; gap:10px; margin:22px 0; color:#344255; }
.field > span, .field legend { font-weight:700; font-size:14px; }
.field select, .field input[type=email], .email-card input[type=email] { width:100%; min-height:50px; padding:0 14px; border:1px solid var(--line); border-radius:10px; background:white; color:var(--ink); }
fieldset.field { border:0; padding:0; }
.binary { display:flex; gap:10px; }
.binary label { flex:1; padding:14px; border:1px solid var(--line); border-radius:10px; background:var(--soft); }
.binary input { margin-right:8px; }
.form-error { color:var(--danger); min-height:20px; font-size:13px; }
.result-hero { background:var(--ink); color:white; border-radius:24px; padding:clamp(34px,6vw,72px); box-shadow:var(--shadow); }
.result-hero .section-label { color:#9ac6bd; }
.result-hero h1 { font-size:clamp(28px,4vw,48px); }
.result-type { display:flex; flex-wrap:wrap; align-items:baseline; gap:12px 18px; margin:36px 0 12px; }
.result-type span { font-size:13px; color:#b8c3d1; }
.result-type strong { font-family:Georgia, "Yu Mincho", serif; font-size:clamp(36px,6vw,66px); font-weight:500; }
.result-type em { font-style:normal; color:#9ac6bd; border:1px solid rgba(154,198,189,.4); padding:7px 11px; border-radius:99px; font-size:12px; }
.subtype { color:#cbd4df; }
.result-summary { max-width:740px; font-size:18px; line-height:1.9; }
.relative-note { max-width:740px; color:#b9c4d0; font-size:13px; line-height:1.7; }
.safety-note { background:var(--warning-soft); color:#6b3c18; border:1px solid #ebc28e; border-radius:var(--radius); padding:24px 28px; margin:18px 0; }
.safety-note h2 { margin-top:0; }
.result-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:18px 0; }
.result-grid article { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:30px; }
.result-grid h2, .email-card h2, .related h2 { margin:0 0 18px; font-size:21px; }
.result-grid li { margin:10px 0; line-height:1.7; }
.stop-card { background:var(--accent-soft)!important; border-color:#bdd9d3!important; }
.quote-card { background:#f3f1ec!important; }
blockquote { margin:0; font-family:Georgia, "Yu Mincho", serif; font-size:22px; line-height:1.7; }
.email-card { display:grid; grid-template-columns:1fr 1fr; gap:40px; background:white; border:1px solid var(--line); border-radius:var(--radius); padding:36px; margin:18px 0; }
.email-card form, .email-card label { display:grid; gap:9px; }
.email-card form { gap:16px; }
.email-card label span { font-size:13px; font-weight:700; }
.email-card .consent { grid-template-columns:auto 1fr; align-items:start; }
.email-card .consent span { font-weight:400; line-height:1.5; color:var(--muted); }
.related { margin:18px 0; padding:30px; border-top:1px solid var(--line); }
.related div { display:flex; flex-wrap:wrap; gap:10px; }
.related span { background:white; border:1px solid var(--line); padding:10px 14px; border-radius:99px; color:#425066; }
.center { text-align:center; margin:24px 0; }
.message-card { text-align:center; padding-top:80px; padding-bottom:80px; }
.message-card h1 { max-width:760px; margin-left:auto; margin-right:auto; font-size:clamp(30px,4vw,44px); text-wrap:balance; }
.success-mark { width:62px; height:62px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:white; font-size:28px; margin:0 auto 22px; }
footer { max-width:820px; margin:26px auto 0; color:var(--muted); font-size:11px; line-height:1.8; text-align:center; }
@media (max-width: 760px) {
  .shell { width:min(100% - 20px, 1080px); margin:10px auto 18px; }
  .brandbar { padding:4px 4px 0; }
  .privacy-note { display:none; }
  .intro-grid { grid-template-columns:1fr; min-height:auto; }
  .intro-copy { padding:38px 26px; }
  .intro-panel { padding:24px 28px; }
  .observation-line { padding:16px 0; }
  .question-card, .form-card, .message-card { padding:28px 20px; }
  .result-hero { padding:34px 24px; }
  .result-grid, .email-card { grid-template-columns:1fr; }
  .email-card { padding:28px 20px; gap:22px; }
  .binary { flex-direction:column; }
  .nav-row .primary, .nav-row .secondary { flex:1; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
.answer-copy { display:grid!important; place-items:start!important; width:auto!important; height:auto!important; border-radius:0!important; background:transparent!important; color:inherit!important; gap:2px; }
.answer-copy strong { font-size:14px; }
.answer-copy small { font-size:11px; font-weight:400; color:var(--muted); }
.fixed-note { margin:0 0 26px; padding:14px 16px; border:1px solid rgba(255,255,255,.25); color:#d7e0e8; font-size:13px; line-height:1.7; }
.strength { display:inline-block; margin:18px 0 8px; padding:7px 11px; border:1px solid rgba(154,198,189,.4); color:#9ac6bd; font-size:12px; }
.observation-card { background:white; border:1px solid var(--line); border-radius:var(--radius); padding:32px; margin:18px 0; }
.observation-card h2 { margin:0 0 14px; font-family:Georgia, "Yu Mincho", serif; font-size:clamp(22px,3vw,32px); line-height:1.55; font-weight:500; }
.observation-card p:last-child { color:var(--muted); font-size:13px; line-height:1.7; }
.email-card a, footer a { color:var(--accent); }
.draft-status { color:var(--danger); font-weight:700; }
.result-hero.no-clear-pattern h1, .result-hero.insufficient h1 { font-size:clamp(30px,4.2vw,50px); }
.result-hero.multiple h1 { font-size:clamp(28px,4vw,46px); }
@media (max-width:760px) {
  .fixed-note { margin-bottom:20px; }
  .observation-card { padding:26px 20px; }
}

.footer-note,.footer-links,.email-note,.email-links,.subtle-note{color:#7b8492;font-size:12px;line-height:1.65}
.footer-links a,.email-links a{color:#7b8492;text-decoration:underline;text-underline-offset:2px}
.email-note{margin:0 0 10px}.email-links{margin:10px 0 0;text-align:center}
.draft-status{display:none!important}.consent{display:none!important}
