:root{color-scheme:light;--ink:#20201c;--paper:#fffdf6;--accent:#ffdc36;--line:#d6d3c7;font-family:'Hiragino Sans','Yu Gothic',sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;line-height:1.8;background-image:linear-gradient(#77777705 1px,transparent 1px),linear-gradient(90deg,#77777705 1px,transparent 1px);background-size:32px 32px}button,input,select,textarea{font:inherit}button,a,input,textarea,select{touch-action:manipulation}a{color:inherit}.brand{max-width:1000px;margin:auto;padding:25px 24px;display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);flex-wrap:wrap}.brand a{font-weight:800;text-decoration:none}.brand span{font-size:13px}.page{max-width:800px;margin:auto;padding:42px 24px 64px}h1,h2,h3,p{margin:0}h2{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(24px,4.8vw,36px);line-height:1.5;letter-spacing:-.025em}h3{font-size:22px}#cao-diagnosis-form,.section,.step,form,.field,#result,#report-sections{display:grid;gap:20px}.section p{font-size:16px}.text-small{font-size:14px;color:#5d5b52}.form-label,legend{font-weight:700;display:block}.field{gap:9px}.form-control,.form-select{display:block;width:100%;min-width:0;border:1px solid #b7b3a6;background:#fffefb;border-radius:8px;padding:13px 14px;font-size:16px;line-height:1.8}.form-control::placeholder{color:#87857b;opacity:1}textarea{resize:vertical}.form-control:focus,.form-select:focus{outline:3px solid #e8bd1590;outline-offset:2px}fieldset{border:0;padding:0;margin:0;display:grid;gap:12px}.form-check{display:flex;align-items:flex-start;gap:12px;padding:12px;background:#f1eee4;border-radius:8px}.form-check-input{width:20px;height:20px;margin-top:5px;accent-color:#6a5710;flex-shrink:0}.viz-row,.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.btn{display:inline-flex;justify-content:center;align-items:center;min-height:48px;max-width:100%;padding:12px 20px;border:1px solid var(--line);border-radius:7px;background:#fffefb;font-weight:700;cursor:pointer;text-decoration:none}.btn-primary{background:var(--accent);border-color:#c6a812}.btn:disabled{opacity:.55;cursor:wait}.progress{height:5px;background:#e5e1d6;border-radius:3px;overflow:hidden}.progress-bar{height:100%;background:#d6af00}.summary{white-space:pre-wrap;overflow-wrap:anywhere;background:#f0ede4;padding:20px;border-radius:8px}.text-destructive,#result-error{color:#a52d20}details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;font-size:14px}summary{cursor:pointer}details .section{padding-top:16px}footer{text-align:center;padding:28px 24px;font-size:13px;color:#68665c;border-top:1px solid var(--line)}.eyebrow{letter-spacing:.13em;font-size:12px}#result h1{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(28px,5vw,40px)}#reference{font-size:13px;color:#656358}.report-section{padding:24px 0;border-top:1px solid var(--line)}.report-section h2,#followup h2,#consultation h2{font-family:inherit;font-size:21px;margin-bottom:14px}.report-section h2{border-left:5px solid var(--accent);padding-left:12px}.report-section p{white-space:pre-wrap;overflow-wrap:anywhere}.report-section p+p{margin-top:14px}#followup,#followup-fields,#consultation{display:grid;gap:18px}#consultation{padding:24px;background:#f0ede4;border-radius:8px;margin-top:12px}#consultation p{font-size:15px}[hidden]{display:none!important}@media(max-width:480px){.page{padding:26px 16px 40px}.brand{padding:20px 16px}.btn-primary{flex-grow:1}textarea{min-height:125px}}@media print{.brand,footer,.actions,#consultation,#followup,.btn,#cao-diagnosis-form{display:none!important}.page{padding:0;max-width:none}.report-section{break-inside:avoid}}
.review-field{padding:14px 0;border-bottom:1px solid var(--line);min-width:0}.review-field:first-child{padding-top:0}.review-field:last-child{border-bottom:0}.review-field h4,.review-field label{font-size:14px;font-weight:700;margin:0 0 6px;display:block}.review-field p{font-size:15px;white-space:pre-wrap;margin:0}.summary:has(input){white-space:normal}.task-article{margin-top:24px}.task-article h3{font-size:24px;margin:5px 0 10px}.task-article p{font-size:16px}.flow{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:30px}.compact-flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.system-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.flow-node{padding:16px;position:relative;border:1px solid var(--line);border-radius:9px;background:#f2efe5;min-width:0}.actor-ai{background:#fff1a8;border-color:#dbc04c}.actor-output{background:#e9efe6}.flow-node:not(:last-child)::after{content:'→';position:absolute;right:-22px;top:32%;color:#777468}.flow-node h4{font-size:16px;line-height:1.6;margin:5px 0}.flow-node p{font-size:14px;line-height:1.7}.flow-num{font-size:12px;letter-spacing:.12em;color:#69675d}.report-section>h3{margin-top:20px;font-size:21px}.check-list{padding-left:23px;margin:18px 0 0;display:grid;gap:10px}.course-price{background:var(--accent);padding:12px 16px;border-radius:6px;font-weight:700;margin-bottom:18px}.course-types{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.course-types span{background:#f0ede4;border-radius:6px;padding:8px 12px;font-size:14px}.course-branches{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.course-branches article{border:1px solid var(--line);border-radius:9px;padding:20px}.course-branches h4{font-size:20px;margin:8px 0}.course-branches strong{display:block;margin:10px 0}.course-branches p{font-size:15px}.system-flow .flow-node:nth-child(2n)::after{content:'↓';right:45%;top:auto;bottom:-27px}.system-flow .flow-node:last-child::after{content:none}.report-section{break-inside:auto}.task-article,.flow-node,.course-branches article{break-inside:avoid}@media(max-width:540px){.compact-flow,.system-flow,.course-branches{grid-template-columns:1fr;gap:25px}.flow-node:not(:last-child)::after,.system-flow .flow-node:nth-child(2n)::after{content:'↓';right:48%;top:auto;bottom:-28px}.flow-node:last-child::after{content:none}.task-article h3{font-size:21px}}@media print{.flow,.course-branches{break-inside:avoid}.report-section p{font-size:12px}.flow-node{padding:8px}.course-types span{padding:4px}}
@media(min-width:541px){.system-flow .flow-node:nth-child(3){grid-column:2;grid-row:2}.system-flow .flow-node:nth-child(4){grid-column:1;grid-row:2}.system-flow .flow-node:nth-child(5){grid-column:1;grid-row:3}.system-flow .flow-node:nth-child(6){grid-column:2;grid-row:3}.system-flow .flow-node:nth-child(3):not(:last-child)::after{content:'←';left:-22px;right:auto;top:32%;bottom:auto}.system-flow .flow-node:nth-child(4):not(:last-child)::after{content:'↓';right:45%;bottom:-27px;top:auto}}
/* Bold, directional connectors for all explanation diagrams. */
.flow-node:not(:last-child)::after{font-size:28px;font-weight:900;line-height:1;z-index:1;color:#504c3d;content:'➜';right:-27px;top:38%}
@media(min-width:541px){.system-flow .flow-node:nth-child(2n):not(:last-child)::after{content:'⬇';right:44%;top:auto;bottom:-29px}.system-flow .flow-node:nth-child(3):not(:last-child)::after{content:'⬅';left:-27px;right:auto;top:38%;bottom:auto}.system-flow .flow-node:nth-child(4):not(:last-child)::after{content:'⬇';right:44%;left:auto;top:auto;bottom:-29px}}
.course-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 8px}.exit-card{border:1px solid var(--line);padding:18px 14px;border-radius:9px;background:#f7f4eb;position:relative;min-width:0}.exit-card.selected{background:#fff1a8;border:3px solid #aa8200;padding:16px 12px}.exit-card h4{margin:8px 0;font-size:17px;line-height:1.65}.exit-card p{font-size:14px!important}.exit-letter{display:inline-block;background:none!important;padding:0!important;border-radius:0!important;font-size:30px!important;font-weight:800;line-height:1}.your-choice{display:block;margin-top:12px;color:#4b3b00;font-size:14px}.choice-note{font-size:14px;color:#5d5b52}.followup-letter{margin:14px 0 18px;padding:24px;border:2px solid #c6a812;border-radius:10px;background:#fff3b7}.followup-letter h4{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:26px;line-height:1.6;margin:8px 0 12px}.contact-address{font-size:13px;overflow-wrap:anywhere}.actions a:has(.contact-address){display:block;text-align:center}.messenger-fallback{font-size:14px!important}.messenger-fallback a{text-decoration:underline;text-underline-offset:3px;font-weight:700}@media(max-width:540px){.flow-node:not(:last-child)::after,.system-flow .flow-node:nth-child(2n):not(:last-child)::after{content:'⬇';right:47%;top:auto;bottom:-29px}.course-types{grid-template-columns:1fr}.exit-card{display:grid;grid-template-columns:35px 1fr;column-gap:12px}.exit-card .exit-letter{grid-column:1;grid-row:1 / 4}.exit-card h4,.exit-card p,.exit-card .your-choice{grid-column:2}.exit-card h4{margin-top:0}.followup-letter{padding:18px}.followup-letter h4{font-size:23px}}
.flow .flow-node:last-child::after{content:none!important}
.closing-message{margin:42px 0 8px;padding:34px 0 12px;border-top:5px solid var(--accent);display:grid;grid-template-columns:minmax(150px,230px) minmax(0,1fr);gap:28px;align-items:center}.closing-message img{display:block;width:100%;height:auto;max-width:230px;object-fit:contain}.closing-message h2{font-size:clamp(24px,3vw,30px);line-height:1.75;margin:8px 0 20px}.closing-invitation{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(22px,2.7vw,26px);line-height:1.9}.closing-message .eyebrow{font-weight:700}@media(max-width:540px){.closing-message{grid-template-columns:1fr;gap:18px;text-align:center;padding-top:26px}.closing-message img{max-width:210px;margin:auto}.closing-message h2{font-size:23px}.closing-invitation{font-size:22px}}@media print{.closing-message{break-inside:avoid;grid-template-columns:140px 1fr}.closing-message img{max-width:140px}}

/* 2026-11-09: a guided, visual introduction instead of a wall of text. */
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
.page{max-width:1120px;padding:44px 32px 70px}.brand{max-width:1120px}.brand a{font-size:20px}#cao-diagnosis-form{gap:24px}.diagnosis-intro{display:grid;gap:26px}.hero-main{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr);gap:36px;align-items:center;padding:12px 0 8px}.intro-kicker{font-size:13px;letter-spacing:.1em;margin-bottom:15px;color:#696455}.diagnosis-intro #intro-title{font-family:'Hiragino Sans','Yu Gothic',sans-serif;font-size:clamp(32px,4.5vw,54px);font-weight:850;letter-spacing:-.05em;line-height:1.5}.marked-title{position:relative;display:inline-block;z-index:0}.marked-title svg{position:absolute;left:-2%;bottom:3%;width:103%;height:16px;z-index:-1}.hero-lead{font-size:17px;line-height:1.95;margin-top:24px;color:#514d42}.host-guide{position:relative;display:grid;justify-items:center;align-content:center;gap:0}.host-guide img{width:200px;height:210px;object-fit:contain;margin-top:15px}.host-sign{font-size:12px;color:#696455;margin-top:5px}.speech-bubble{position:relative;background:#ffec8a;border:2px solid #26251e;border-radius:43% 47% 41% 45% / 18% 24% 20% 22%;padding:21px 30px 25px;text-align:center;box-shadow:4px 5px 0 #28251c0b}.speech-bubble:after{content:'';position:absolute;bottom:-13px;left:45%;width:20px;height:22px;background:#ffec8a;border-right:2px solid #26251e;border-bottom:2px solid #26251e;transform:skewY(30deg) rotate(40deg)}.speech-bubble>span{font-size:18px;font-weight:700;display:block}.speech-bubble strong{display:block;font-size:26px;line-height:1.6;white-space:nowrap}.speech-bubble p{font-size:13px;line-height:1.75;margin-top:5px}.intro-journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;padding:22px 0;margin:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:30px}.intro-journey li{position:relative;display:flex;gap:12px;align-items:center}.intro-journey li:not(:last-child):after{content:'➜';position:absolute;right:-23px;top:8px;font-size:24px;color:#a78c21}.journey-number{font-family:Georgia,serif;font-size:32px;color:#b79818}.intro-journey strong{font-size:17px;font-weight:700;display:block}.intro-journey small{font-size:12px;color:#716b5c;display:block;margin-top:3px}.daily-limit{display:flex;gap:24px;align-items:center;padding:16px 20px;background:#fff3ef;border-left:4px solid #b72d24}.daily-limit>strong{color:#b42620;font-size:17px;line-height:1.7;flex-shrink:0}.daily-limit p{font-size:12px;line-height:1.7;color:#756057}.daily-limit p span{display:block}.privacy-reminder{display:flex;gap:16px;padding:18px 20px;background:#fff9df;border:1px solid #dcc56f;border-radius:5px}.note-symbol{font-size:32px;font-weight:700;line-height:1.3;color:#7b6015}.privacy-reminder strong{font-size:14px;display:block;margin-bottom:5px}.privacy-reminder p{font-size:16px;line-height:1.8;color:#302a17}.privacy-reminder small{display:block;font-size:12px;color:#71654a;margin-top:5px}.diagnosis-about{padding:16px 0}.diagnosis-about summary{font-size:14px;color:#5a554a}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:24px 0 8px}.about-grid h2{font:700 17px/1.7 'Hiragino Sans','Yu Gothic',sans-serif;margin-bottom:10px}.about-grid ul{padding-left:20px;display:grid;gap:8px;margin:0 0 12px}.about-grid p,.about-grid li{font-size:14px;line-height:1.9}.about-course{grid-column:1/-1;border-top:1px solid var(--line);padding-top:20px}.about-course ul{margin-top:10px}.question-heading{margin-bottom:8px}.question-heading>span{font-size:12px;color:#8b721c;letter-spacing:.08em}.question-heading h2{font:750 27px/1.6 'Hiragino Sans','Yu Gothic',sans-serif;letter-spacing:-.025em;margin-top:6px}.mobile-break{display:none}#cao-diagnosis-form>form{background:#fffefb;border:1px solid #ded8c8;border-radius:10px;padding:32px;gap:24px;box-shadow:5px 6px 0 #e9d87f26}.step{gap:24px}.field{padding:0 0 22px;border-bottom:1px solid #ede8dc}.field:last-child{padding-bottom:0;border-bottom:0}.form-label,legend{font-size:16px;font-weight:650;line-height:1.8}.required-label{font-size:11px;color:#865b15;border:1px solid #e5d294;background:#fff5d5;border-radius:3px;padding:2px 6px;display:inline-block;margin-left:5px;vertical-align:middle}.form-control,.form-select{background:#fff;border-color:#cac4b4;border-radius:6px}.form-control:focus,.form-select:focus{border-color:#9f800a}.btn{user-select:none;-webkit-user-select:none}.btn-primary{color:#272317;box-shadow:0 3px 0 #c1a62e}.btn:active{transform:translateY(1px)}#cao-diagnosis-form:has(.step[data-step="0"][hidden]) .diagnosis-intro{display:none}#cao-diagnosis-form:has(.step[data-step="0"][hidden]) .diagnosis-about{margin-bottom:4px}.report-section{background:#fffefb;border:1px solid #e4ddcb;border-radius:10px;padding:28px;margin-top:8px}.report-section>h2{font-size:22px;border:0;padding:0 0 15px;border-bottom:3px solid #eed354;margin-bottom:20px}.task-article+.task-article{border-top:1px dashed #d7cba8;padding-top:24px}.report-section p{line-height:1.95;font-weight:400}.course-price{background:#ffeb8a}.check-list li{line-height:1.9}.followup-letter{border-color:#cfb43a}.closing-message{padding:35px 20px}#result{max-width:900px;margin:auto}#result h1{font-family:'Hiragino Sans','Yu Gothic',sans-serif;font-size:clamp(25px,4vw,36px)}.course-types .exit-card{box-shadow:none}.report-section h3{font-weight:700}.summary{background:#faf7ed}.review-field{padding:18px 0}.review-field h4{font-size:13px;color:#827042}
@media(hover:hover) and (pointer:fine){.btn-primary:hover{background:#ffe564}.form-check:hover{background:#eee7cf}}
@media(max-width:680px){.page{padding:22px 18px 44px}.brand{padding:18px;align-items:center}.brand a{font-size:17px}.brand span{font-size:11px}.hero-main{grid-template-columns:1fr;gap:24px;padding:0}.diagnosis-intro{gap:20px}.diagnosis-intro #intro-title{font-size:clamp(30px,7.9vw,44px);line-height:1.45}.hero-lead{font-size:15px;line-height:1.8;margin-top:16px}.desktop-break{display:none}.intro-kicker{margin-bottom:10px;font-size:11px}.host-guide{grid-template-columns:105px minmax(0,1fr);column-gap:14px;align-items:center;justify-items:stretch}.host-guide img{grid-column:1;grid-row:1;width:105px;height:115px;margin:0}.speech-bubble{grid-column:2;grid-row:1;padding:14px 12px 16px;border-radius:10px}.speech-bubble:after{left:-11px;bottom:32%;width:17px;height:16px;transform:rotate(135deg);background:#ffec8a}.speech-bubble>span{font-size:15px}.speech-bubble strong{font-size:21px}.speech-bubble p{font-size:11px;margin-top:3px}.host-sign{grid-column:1/-1;text-align:center;font-size:10px;margin-top:9px}.intro-journey{gap:20px;padding:17px 0}.intro-journey li{display:grid;gap:4px}.journey-number{font-size:22px;line-height:1.1}.intro-journey strong{font-size:12px;line-height:1.7}.intro-journey small{font-size:10px;line-height:1.6}.intro-journey li:not(:last-child):after{right:-18px;top:15px;font-size:18px}.daily-limit{display:block;padding:13px 14px}.daily-limit>strong{font-size:15px}.daily-limit p{font-size:11px;margin-top:5px}.daily-limit p br{display:none}.daily-limit p span{display:inline}.privacy-reminder{padding:15px 13px;gap:10px}.note-symbol{font-size:26px}.privacy-reminder p{font-size:14px}.privacy-reminder strong{font-size:12px}.privacy-reminder small{font-size:11px}.about-grid{grid-template-columns:1fr;gap:20px}.about-course{grid-column:auto}.diagnosis-about summary{font-size:13px}#cao-diagnosis-form>form{padding:22px 17px}.question-heading h2{font-size:23px}.mobile-break{display:block}.form-label,legend{font-size:15px}.form-control,.form-select{font-size:16px}.report-section{padding:22px 17px}.report-section>h2{font-size:19px}.closing-message{padding-left:0;padding-right:0}footer{padding-bottom:calc(26px + env(safe-area-inset-bottom,0px))}}
@media(max-width:350px){.page{padding-left:12px;padding-right:12px}.host-guide{grid-template-columns:85px minmax(0,1fr);gap:10px}.host-guide img{width:85px;height:105px}.speech-bubble strong{font-size:19px}.intro-journey small{font-size:9px}}
@media print{.diagnosis-intro,.diagnosis-about{display:none}.report-section{border:0;padding:18px 0;box-shadow:none}.page{max-width:none}}

/* Comic greeting on the first step */
.host-guide {
  --comic-ink: #252018;
  --comic-yellow: #ffdd46;
  --comic-red: #bf342c;
  gap: 16px;
}
.speech-bubble {
  position: relative;
  isolation: isolate;
  max-width: 100%;
  width: fit-content;
  margin-inline: auto;
  padding: 18px 28px 19px;
  color: var(--comic-ink);
  background: #fffdf3;
  border: 3px solid var(--comic-ink);
  border-radius: 48% 43% 42% 36% / 25% 32% 27% 27%;
  box-shadow: 5px 6px 0 var(--comic-ink);
}
.speech-bubble::before {
  content: "";
  position: absolute;
  inset: 4px;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(circle, #e8b923 1px, transparent 1.3px) 0 0 / 6px 6px;
  mask-image: linear-gradient(138deg, #000 1%, transparent 24%, transparent 80%, #000);
}
.speech-bubble::after { content: none; }
.speech-tail {
  position: absolute;
  top: calc(100% - 5px);
  left: 48%;
  width: 43px;
  height: 30px;
  background: var(--comic-ink);
  clip-path: polygon(0 0, 100% 0, 19% 100%, 30% 44%);
}
.speech-tail::after {
  content: "";
  position: absolute;
  inset: 0 6px 5px 5px;
  background: #fffdf3;
  clip-path: polygon(0 0, 100% 0, 25% 100%, 38% 48%);
}
.speech-bubble .speech-callout {
  position: relative;
  isolation: isolate;
  display: inline-block;
  padding: 5px 13px 7px;
  color: var(--comic-red);
  font-weight: 900;
  transform: rotate(-5deg);
}
.speech-callout::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--comic-yellow);
  clip-path: polygon(0 22%, 12% 22%, 10% 0, 29% 12%, 51% 2%, 69% 14%, 92% 1%, 88% 24%, 100% 24%, 95% 64%, 100% 88%, 74% 80%, 67% 100%, 49% 88%, 26% 100%, 26% 83%, 4% 95%, 10% 63%);
}
.speech-bubble strong { font-weight: 900; }
.speech-bubble p { position: relative; z-index: 1; font-size: 13px; }
.speech-bubble .speech-letter { display: inline; font: inherit; color: inherit; }
.speech-letter[data-pending] { visibility: hidden; }
.speech-reader { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.host-portrait {
  display: grid;
  place-items: center;
  width: 192px;
  aspect-ratio: 1;
  position: relative;
  isolation: isolate;
}
.host-portrait::before {
  content: "";
  position: absolute;
  inset: 13% 4% 4%;
  z-index: -1;
  border: 2px solid var(--comic-ink);
  border-radius: 50%;
  background: radial-gradient(circle, #372b161c 1px, transparent 1.4px) 0 0 / 6px 6px, #ffe778;
}
.host-portrait img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
}
@media (max-width: 680px) {
  .host-guide {
    grid-template-columns: minmax(76px, 1fr) minmax(0, 2.2fr);
    gap: 12px;
    align-items: center;
  }
  .speech-bubble { margin-inline: 0 auto; padding: 10px 13px 13px; box-shadow: 4px 4px 0 var(--comic-ink); }
  .speech-tail {
    top: 49%;
    left: -19px;
    width: 25px;
    height: 22px;
    transform: rotate(90deg);
  }
  .speech-tail::after { inset: 0 4px 4px 3px; }
  .speech-bubble p { font-size: 11px; }
  .speech-bubble strong { font-size: clamp(16px, 5.2vw, 21px); }
  .host-portrait { grid-column: 1; grid-row: 1; width: 100%; }
  .host-portrait img { grid-column: auto; grid-row: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .speech-letter[data-pending] { visibility: visible; }
}

/* A single new notebook sheet, using the Facebook paper and the pencil studies as references. */
:root { --paper: #faf5e9; }
body {
  position: relative;
  isolation: isolate;
  background: var(--paper);
}
body::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: max(810px, 67vw);
  z-index: -1;
  pointer-events: none;
  background: url("/dojo-notebook.jpg?v=3") right top / max(113%, 1180px) auto no-repeat;
  mask-image: linear-gradient(#000 83%, transparent);
  opacity: .53;
}
/* The image contains three sheets in order. Its full cycle repeats down the document. */
body::after {
  content: "";
  position: absolute;
  inset: clamp(560px, 55vw, 1050px) 0 0;
  z-index: -2;
  pointer-events: none;
  background: url("/dojo-notebook-cycle.jpg") center top / max(100%, 1050px) auto repeat-y;
  mask-image: linear-gradient(transparent, #000 175px);
  opacity: .82;
}
#cao-diagnosis-form > form,
.report-section {
  background-color: #fffefb96;
}
.hero-main {
  position: relative;
}
.diagnosis-intro #intro-title {
  letter-spacing: .055em;
  line-height: 1.64;
  font-size: clamp(32px, 4.1vw, 52px);
}
.intro-journey {
  grid-template-columns: 1fr 1.12fr 1.5fr;
  background: #fffdf57a;
  padding-inline: 10px;
}
.intro-journey li {
  min-width: 0;
  align-items: center;
}
.intro-journey strong {
  line-height: 1.65;
}
@media (max-width: 680px) {
  body::before {
    height: 326px;
    background-position: right -17px top 36px;
    background-size: auto 500px;
    mask-image: linear-gradient(#000 68%, transparent);
    opacity: .40;
  }
  body::after {
    top: 214px;
    background-size: clamp(580px, 150vw, 1050px) auto;
    background-position: 52% top;
    mask-image: linear-gradient(transparent, #000 140px);
    opacity: .80;
  }
  .hero-main::after {
    content: "";
    display: block;
    justify-self: end;
    width: min(176px, 57%);
    aspect-ratio: 3.1;
    margin-top: -16px;
    margin-bottom: -6px;
    pointer-events: none;
    background: url("/dojo-notebook.jpg?v=3") 74% 61% / 405% auto no-repeat;
    mask-image: radial-gradient(ellipse 77% 70% at center, #000 66%, transparent);
  }
  .diagnosis-intro #intro-title {
    font-size: clamp(25px, 7.65vw, 40px);
    line-height: 1.62;
    letter-spacing: .05em;
  }
  .intro-journey {
    grid-template-columns: minmax(0, 1fr);
    gap: 15px;
    padding: 13px 10px;
  }
  .intro-journey li {
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: 9px;
  }
  .intro-journey strong {
    font-size: 13px;
    line-height: 1.65;
  }
  .intro-journey li:not(:last-child)::after {
    top: auto;
    bottom: -18px;
    right: auto;
    left: 6px;
    font-size: 13px;
    transform: rotate(90deg);
  }
}
@media print {
  body { background: #fff; }
  body::before, body::after { content: none; }
  #cao-diagnosis-form > form, .report-section { background: #fff; }
}



/* The invitation reads as one title, with the two handwritten words on the banana. */
.brand {
  display: grid;
  justify-content: stretch;
  align-items: start;
  gap: 6px;
  padding-block: 16px 24px;
}
.brand > a {
  justify-self: start;
  font-size: 15px;
  font-weight: 550;
  letter-spacing: .02em;
}
.brand .masthead-title {
  display: grid;
  justify-items: center;
  text-align: center;
  line-height: 1.2;
  letter-spacing: .055em;
  font-weight: 850;
}
.brand .masthead-opening,
.brand .masthead-ending {
  font-size: clamp(22px, 3.1vw, 39px);
}
.masthead-banana {
  display: block;
  width: min(100%, 620px);
  height: auto;
  margin: 2px auto 3px;
}
.diagnosis-intro #intro-title {
  font-size: clamp(25px, 3.45vw, 43px);
}
@media (min-width: 1000px) {
  .hero-main .host-guide {
    justify-self: end;
    width: min(100%, 300px);
  }
}
@media (max-width: 680px) {
  .brand {
    padding: 13px 18px 18px;
    gap: 10px;
  }
  .brand > a {
    font-size: 13px;
  }
  .brand .masthead-opening,
  .brand .masthead-ending {
    font-size: clamp(19px, 5.3vw, 25px);
  }
  .diagnosis-intro #intro-title {
    font-size: clamp(22px, 6.5vw, 34px);
  }
}

/* Two routes after the prescription, with a shared branching connector. */
.intro-journey .journey-split {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.journey-routes {
  --branch-ink: #a78c21;
  --route-height: 46px;
  position: relative;
  display: grid;
  gap: 8px;
  padding-left: 32px;
}
.journey-routes::before {
  content: "";
  position: absolute;
  top: calc(var(--route-height) / 2);
  bottom: calc(var(--route-height) / 2);
  left: 7px;
  border-left: 2px solid var(--branch-ink);
}
.journey-routes::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 8px;
  border-top: 2px solid var(--branch-ink);
}
.journey-choice {
  position: relative;
  min-width: 0;
  min-height: var(--route-height);
  padding: 5px 12px;
  border: 1px solid #bcb29b;
  border-radius: 8px;
  background: #fffdf7;
  color: var(--ink);
  text-align: left;
  font-weight: 700;
  font-size: clamp(13px, 1.4vw, 16px);
  line-height: 1.4;
  cursor: pointer;
}
.journey-choice::before {
  content: "";
  position: absolute;
  right: 100%;
  top: 50%;
  width: 25px;
  border-top: 2px solid var(--branch-ink);
}
.journey-choice::after {
  content: "";
  position: absolute;
  right: calc(100% + 1px);
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid var(--branch-ink);
  border-right: 2px solid var(--branch-ink);
  transform: translateY(-40%) rotate(45deg);
}
.journey-choice-dojo {
  background: #fff2bb;
  border-color: #bd9c38;
  font-weight: 800;
}
.journey-choice[aria-expanded="true"] {
  box-shadow: inset 0 0 0 1px #a78c21;
}
.journey-choice:focus-visible {
  outline: 2px solid #795e12;
  outline-offset: 3px;
}
.journey-guide {
  padding: 12px 15px;
  border-left: 3px solid #b69836;
  background: #fffdf5d9;
  font-size: 14px;
}
@media (min-width: 681px) {
  .intro-journey { grid-template-columns: .9fr 1.15fr 1.55fr; }
  .intro-journey > li:not(:last-child)::after {
    top: 50%;
    transform: translateY(-50%);
  }
}
@media (max-width: 680px) {
  .intro-journey .journey-split {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
  }
}

.diagnosis-loading {
  position: fixed;
  inset: 0;
  z-index: 10;
  display: grid;
  place-items: center;
  padding: 20px;
  background: #f7f2e5de;
}
.diagnosis-loading[hidden],
.brand .masthead-title[hidden] { display: none; }
.diagnosis-loading-card {
  width: min(100%, 370px);
  padding: 26px 18px;
  text-align: center;
  border: 1px solid #d9c99e;
  border-radius: 16px;
  background: #fffdf6;
  box-shadow: 0 12px 36px #44351a20;
}
.diagnosis-loading-card strong { display: block; font-size: 19px; }
.diagnosis-loading-card p { font-size: 14px; }
.diagnosis-loader {
  width: 86px;
  height: 86px;
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
  position: relative;
}
.diagnosis-loader-ring {
  position: absolute;
  inset: 0;
  border: 4px solid #eee6c6;
  border-top-color: #9a7200;
  border-right-color: #e9b900;
  border-radius: 50%;
  animation: diagnosis-turn 1.2s linear infinite;
}
.diagnosis-loader img {
  object-fit: contain;
  animation: diagnosis-turn 4s linear infinite;
}
@keyframes diagnosis-turn { to { transform: rotate(1turn); } }
@media (prefers-reduced-motion: reduce) {
  .diagnosis-loader img, .diagnosis-loader-ring { animation: none; }
}
#report-masthead .masthead-banana { width: min(100%, 520px); }
#result-title { font-size: clamp(22px, 4vw, 33px); }
.system-proposal + .system-proposal {
  margin-top: 30px;
  padding-top: 24px;
  border-top: 1px dashed var(--line);
}
.coaching-intro { margin: 14px 0 16px; }
.coaching-callout {
  padding: 10px 14px;
  border-left: 4px solid #d0a400;
  background: #fff2b5;
}
.coaching-promise {
  display: block;
  margin-top: 12px;
  font-size: 17px;
}
.coaching-flow {
  --coaching-arrow: #8f731e;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  align-items: center;
  gap: 26px;
  margin-top: 16px;
}
.coaching-flow-start,
.coaching-flow-destination {
  padding: 12px 15px;
  border: 1px solid #cdbf96;
  border-radius: 8px;
  background: #fffdf4;
}
.coaching-flow-start { position: relative; text-align: center; }
.coaching-flow-start::after {
  content: "→";
  position: absolute;
  left: 100%;
  width: 26px;
  color: var(--coaching-arrow);
}
.coaching-flow-branches { display: grid; gap: 9px; }
.coaching-flow-destination h4 { margin: 0 0 4px; }
.coaching-flow-destination p { font-size: 14px; }
.coaching-flow-development { background: #fff3bc; }
.coaching-contact-heading { margin: 18px 0 8px; }
.contact-banana { margin-left: 5px; font-size: .72em; }
.closing-belief { margin-top: 18px; font-weight: 750; }
@media (max-width: 540px) {
  .coaching-flow { grid-template-columns: 1fr; gap: 25px; }
  .coaching-flow-start::after {
    content: "↓";
    left: calc(50% - 13px);
    top: 100%;
  }
}
@media print {
  .diagnosis-loading { display: none !important; }
}
.coaching-flow-branches {
  position: relative;
  grid-auto-rows: 1fr;
  padding-left: 26px;
}
.coaching-flow-branches::before {
  content: "";
  position: absolute;
  inset: calc(25% - 2.25px) auto calc(25% - 2.25px) 0;
  border-left: 2px solid var(--coaching-arrow);
}
.coaching-flow-destination { position: relative; }
.coaching-flow-destination::before {
  content: "⟶";
  position: absolute;
  top: 50%;
  right: 100%;
  width: 26px;
  transform: translateY(-50%);
  text-align: center;
  color: var(--coaching-arrow);
  font-weight: 800;
}
@media (min-width: 541px) {
  .coaching-flow-start::after {
    content: "";
    top: 50%;
    border-top: 2px solid var(--coaching-arrow);
  }
}

.availability-check {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding: 12px 14px;
  border: 1px solid #ded2ac;
  border-radius: 8px;
  background: #fff9df;
}
.availability-check .btn { min-height: 44px; padding: 8px 13px; }
.availability-check p { font-size: 14px; }

#cao-test-limit-note[hidden] { display: none; }

@font-face {
  font-family: "Yuji Syuku Closing";
  src: url("/yuji-syuku-closing.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.system-proposal .automation-step {
  background: #fff6ce;
  border-color: #cfb95c;
}

.system-proposal .owner-step {
  background: #f9e3d8;
  border: 2px solid #9a4430;
}

.flow-actor {
  display: inline-block;
  margin: 0 0 4px 6px;
  color: #604a13;
  font-size: 12px;
  font-weight: 750;
}

.owner-step .flow-actor {
  color: #87321e;
}

.report-section .owner-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  align-items: baseline;
  margin: 12px 0;
  padding: 9px 13px;
  border-left: 4px solid #9a4430;
  background: #f9e3d8;
  color: #762b18;
}

.system-input-note { font-size: .9em; }

.followup-letter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(110px, 30%);
  align-items: center;
  gap: 12px;
}

.followup-letter-sketch {
  display: block;
  width: 100%;
  height: auto;
}

.closing-belief {
  font-family: "Yuji Syuku Closing", "Hiragino Mincho ProN", serif;
  font-size: clamp(22px, 4vw, 38px);
  font-weight: 400;
  line-height: 1.5;
}

@media (max-width: 560px) {
  .followup-letter { grid-template-columns: 1fr; }
  .followup-letter-sketch { width: min(46%, 165px); justify-self: end; }
}

#consultation { container-type: inline-size; }

#consultation .consultation-title {
  font-size: clamp(25px, 5.2cqi, 48px);
  line-height: 1.35;
  font-weight: 800;
}

.consultation-title span { display: inline-block; }

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

.contact-option {
  position: relative;
  display: flex;
  min-width: 0;
  padding-top: 23px;
}

.contact-recommended {
  position: absolute;
  top: 0;
  left: 2px;
  color: #795700;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.4;
}

#consultation .contact-button {
  display: flex;
  flex: 1;
  min-width: 0;
  min-height: 78px;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
  align-items: center;
  padding: 10px 8px;
  border: 1px solid #564e35;
  border-radius: 9px;
  box-shadow: 0 3px 0 #564e35;
  background: #fffdf6;
  color: #26221a;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.35;
}

#consultation .contact-button.btn-primary { background: #ffdc36; }
#consultation .contact-button:hover { filter: brightness(.97); }
#consultation .contact-button:focus-visible { outline: 3px solid #604809; outline-offset: 4px; }
#consultation .contact-button:active { transform: translateY(2px); box-shadow: 0 1px 0 #564e35; }
.contact-address { font-size: 12px; font-weight: 500; overflow-wrap: anywhere; max-width: 100%; }

@container (max-width: 315px) {
  .contact-options { gap: 9px; }
  #consultation .contact-button { padding-inline: 5px; font-size: 13px; }
  .contact-address { font-size: 11px; }
}

/* Align the heading's baseline with the upper edge of the banana. */
.masthead-banner {
  position: relative;
  display: block;
  width: min(100%, 620px);
  aspect-ratio: 1080 / 405;
}
.masthead-banner .masthead-banana {
  position: absolute;
  bottom: 0;
  width: 100%;
  margin: 0;
}
.masthead-curve {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  fill: currentColor;
  font: 850 59px 'Hiragino Sans', 'Yu Gothic', sans-serif;
  letter-spacing: 2px;
}