:root { --mission: #1a7f8e; --money: #b97800; --capacity: #6d4da0; --risk: #a44536; --paper: #f7f9fb; }
.diagnostic-hero::before { background: linear-gradient(130deg, transparent 0 39%, rgba(26,127,142,.72) 39.4% 40.4%, transparent 40.8% 100%), linear-gradient(160deg, transparent 0 71%, rgba(239,162,1,.68) 71.4% 72.2%, transparent 72.6%); }
.diagnostic-hero::after { background: #1a7f8e; }
.diagnostic-hero .hero-card { border-top: 5px solid var(--orange); }
.diagnostic-intro { max-width: 860px; margin-bottom: 25px; }
.diagnostic-intro h2 { margin: 0 0 11px; color: var(--navy); font: 800 clamp(1.7rem,3vw,2.5rem)/1.12 var(--display); letter-spacing: -.025em; }
.diagnostic-intro p { margin: 0; color: var(--gray); }
.context-card { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 25px; padding: 20px; border: 1px solid var(--border); border-radius: 14px; background: var(--white); box-shadow: var(--shadow); }
.context-card .wide { grid-column: 1 / -1; }
.context-card textarea { min-height: 76px; resize: vertical; }
.question-group { overflow: hidden; margin-top: 22px; border: 1px solid var(--border); border-radius: 15px; background: var(--white); box-shadow: var(--shadow); }
.question-group.mission { border-top: 5px solid var(--mission); }
.question-group.money { border-top: 5px solid var(--money); }
.question-group.capacity { border-top: 5px solid var(--capacity); }
.group-head { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 20px 22px; border-bottom: 1px solid var(--border); background: #fbfdff; }
.group-number { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; color: var(--white); background: var(--navy); font-size: .78rem; font-weight: 900; }
.mission .group-number { background: var(--mission); }.money .group-number { background: var(--money); }.capacity .group-number { background: var(--capacity); }
.group-head h2 { margin: 0; color: var(--navy); font: 800 1.55rem var(--display); }
.group-head p { margin: 4px 0 0; color: var(--gray); font-size: .8rem; }
.group-score { min-width: 90px; padding: 9px; border-radius: 10px; color: var(--navy); background: var(--orange-pale); text-align: center; }
.group-score span { display: block; color: var(--gray); font-size: .62rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }.group-score strong { display: block; font-size: 1.15rem; }
.question-list { padding: 4px 22px 14px; }
.question-card { padding: 18px 0; border-bottom: 1px solid var(--border); }.question-card:last-child { border-bottom: 0; }
.question-card h3 { margin: 0; color: var(--navy); font: 800 1rem/1.3 var(--display); }
.question-card .question-num { display: inline-block; margin-right: 7px; color: var(--orange); font: .67rem var(--sans); font-weight: 900; letter-spacing: .08em; }
.scale-options { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 12px; }
.scale-option { position: relative; min-height: 69px; padding: 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--paper); cursor: pointer; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }.scale-option:hover { transform: translateY(-1px); border-color: var(--orange); }
.scale-option input { position: absolute; opacity: 0; pointer-events: none; }.scale-option:has(input:checked) { border-color: var(--navy); background: #e9f0f7; box-shadow: inset 0 0 0 1px var(--navy); }
.mission .scale-option:has(input:checked) { border-color: var(--mission); box-shadow: inset 0 0 0 1px var(--mission); }.money .scale-option:has(input:checked) { border-color: var(--money); box-shadow: inset 0 0 0 1px var(--money); }.capacity .scale-option:has(input:checked) { border-color: var(--capacity); box-shadow: inset 0 0 0 1px var(--capacity); }
.scale-option b { display: block; color: var(--navy); font-size: .78rem; }.scale-option span { display: block; margin-top: 4px; color: var(--gray); font-size: .68rem; line-height: 1.22; }
.diagnostic-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }.btn-danger { border: 1px solid #d8b3ae; color: #873b31; background: #fff; }.btn-danger:hover { background: #fff1ef; }
.results-panel { margin-top: 32px; padding: clamp(22px,4vw,36px); border-radius: 16px; color: var(--white); background: linear-gradient(135deg, var(--navy), #244f79 58%, var(--mission)); box-shadow: var(--shadow); }.results-panel h2 { margin: 0; color: var(--white); font: 800 clamp(1.7rem,3vw,2.35rem)/1.1 var(--display); }.results-intro { max-width: 780px; margin: 8px 0 18px; color: rgba(255,255,255,.82); font-size: .86rem; }
.dimension-results { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }.dimension-result { padding: 15px; border-radius: 10px; color: var(--navy); background: rgba(255,255,255,.96); }.dimension-result > span { display: block; color: var(--slate); font-size: .65rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }.dimension-result strong { display: block; margin-top: 4px; font: 800 1.65rem var(--display); }.dimension-result small { display: block; margin-top: 4px; color: var(--gray); font-size: .75rem; }.score-track { height: 7px; margin-top: 10px; overflow: hidden; border-radius: 99px; background: #dce5ec; }.score-track i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--mission); }.dimension-result.money i { background: var(--money); }.dimension-result.capacity i { background: var(--capacity); }
.pattern-result { display: grid; grid-template-columns: auto 1fr; gap: 16px; margin-top: 19px; padding: 21px; border-radius: 12px; color: var(--ink); background: rgba(255,255,255,.98); }.pattern-mark { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; color: var(--white); background: var(--orange); font: 900 1.3rem var(--display); }.pattern-result.risk .pattern-mark { background: var(--risk); }.pattern-result.opportunity .pattern-mark { background: var(--mission); }.pattern-result h3 { margin: 0; color: var(--navy); font: 800 1.5rem var(--display); }.pattern-result p { margin: 7px 0 0; color: var(--gray); font-size: .85rem; }.pattern-result .next-action { margin-top: 11px; color: var(--navy); font-size: .78rem; font-weight: 800; }.pattern-result .pattern-basis { margin-top: 11px; color: var(--gray); font-size: .72rem; }
.decision-card { margin-top: 26px; padding: 24px; border: 1px solid var(--border); border-radius: 14px; background: var(--white); box-shadow: var(--shadow); }.decision-card h2 { margin: 0; color: var(--navy); font: 800 1.7rem var(--display); }.decision-card > p { margin: 7px 0 17px; color: var(--gray); font-size: .85rem; }.decision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.decision-grid .wide { grid-column: 1 / -1; }.decision-grid textarea { min-height: 80px; resize: vertical; }
.pattern-map { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; margin-top: 32px; }.pattern-card { padding: 17px; border: 1px solid var(--border); border-radius: 11px; background: var(--white); box-shadow: var(--shadow); }.pattern-card .pattern-label { display: inline-block; padding: 4px 7px; border-radius: 99px; color: var(--navy); background: var(--orange-pale); font-size: .62rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }.pattern-card h3 { margin: 10px 0 6px; color: var(--navy); font: 800 1.2rem var(--display); }.pattern-card p { margin: 0; color: var(--gray); font-size: .78rem; line-height: 1.35; }.local-note { margin: 13px 0 0; color: rgba(255,255,255,.75); font-size: .72rem; }
@media (max-width: 800px) { .context-card, .decision-grid, .dimension-results, .pattern-map { grid-template-columns: 1fr; }.scale-options { grid-template-columns: repeat(2, 1fr); }.group-head { grid-template-columns: auto 1fr; }.group-score { grid-column: 1 / -1; width: 120px; margin-left: 46px; }.decision-grid .wide, .context-card .wide { grid-column: auto; } }
@media (max-width: 520px) { .question-list { padding: 4px 15px 14px; }.group-head { padding: 17px; }.scale-options { gap: 6px; }.scale-option { min-height: 72px; padding: 8px; }.pattern-result { grid-template-columns: 1fr; }.pattern-mark { width: 39px; height: 39px; } }
@media print { .nav-toggle, .diagnostic-actions { display: none !important; }.results-panel { color: var(--ink); background: var(--white); border: 1px solid var(--border); }.results-panel h2 { color: var(--navy); }.results-intro, .local-note { color: var(--gray); }.question-group, .decision-card, .results-panel { break-inside: avoid; box-shadow: none; } }