.rtd-standalone-page {
margin: 0 !important;
padding: 0 !important;
background: #f4f1ea;
}
.rtd-standalone-page #rtd-diagnosis-page {
width: 100%;
max-width: none;
margin: 0;
padding: 0;
}
.rtd-app {
--rtd-ink: #101423;
--rtd-paper: #f4f1ea;
--rtd-white: #fff;
--rtd-accent: #7057ff;
--rtd-lime: #c9ff45;
--rtd-muted: #656978;
--rtd-line: rgba(16, 20, 35, .14);
width: 100vw;
max-width: none !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
color: var(--rtd-ink);
background: var(--rtd-paper);
font-family: "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Arial, sans-serif;
font-size: 16px;
line-height: 1.65;
opacity: .01;
transition: opacity .3s ease;
overflow: hidden;
scroll-margin-top: 24px;
}
.rtd-app.rtd-ready { 
opacity: 1; 
}
.rtd-app *, .rtd-app *::before, .rtd-app *::after { 
box-sizing: border-box; 
}
.rtd-app button, .rtd-app input { 
font: inherit; 
}
.rtd-app button { 
appearance: none; 
}
.rtd-app h1, .rtd-app h2, .rtd-app p, .rtd-app fieldset, .rtd-app legend, .rtd-app ul { 
margin: 0; 
padding: 0; 
}
.rtd-app fieldset { 
min-width: 0; 
border: 0; 
}
.rtd-app a { 
color: inherit; 
}
.rtd-shell { 
min-height: 100vh; 
position: relative; 
}
.rtd-header {
width: 100%;
min-height: 78px;
margin: 0 auto;
padding: 0 64px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid var(--rtd-line);
background-color: #fff;
}
.rtd-brand { 
display: inline-flex; 
align-items: center; 
gap: 12px; 
color: var(--rtd-ink); 
text-decoration: none !important; 
font-weight: 900; 
letter-spacing: .08em; 
font-size: 13px; 
}
.rtd-brand img {
width: 100%;
max-width: 200px;
height: auto;
}
.rtd-brand-mark { width: 34px; 
height: 34px; 
display: grid; 
place-items: center; 
color: var(--rtd-white); 
background: var(--rtd-ink); 
border-radius: 50%; 
font-size: 17px; 
}
.rtd-header-note { 
font-size: 11px; 
letter-spacing: .16em; 
font-weight: 700; 
color: var(--rtd-muted);
}
.rtd-footer {
width: 100%;
margin-top: 65px;
position: relative;
overflow: visible;
color: var(--rtd-ink);
background: var(--rtd-white);
}
.rtd-footer::before {
content: none;
width: 0;
height: 0;
position: absolute;
top: -135px;
left: 0;
border-style: solid;
border-width: 0 0 136px 100vw;
border-color: transparent transparent var(--rtd-white) transparent;
}
.rtd-footer-inner {
width: 100%;
max-width: 1204px;
margin: 0 auto;
padding: 48px 32px 12px;
position: relative;
z-index: 1;
text-align: center;
}
.rtd-footer-logo {
width: 320px;
max-width: 100%;
margin: 0 auto;
display: block;
}
.rtd-footer-logo img { 
width: 100%; 
height: auto; 
display: block; 
}
.rtd-footer-links {
margin-top: 16px;
display: flex;
justify-content: center;
align-items: center;
gap: 18px;
}
.rtd-footer-links a {
color: #0057aa;
font-size: 14px;
font-weight: 700;
text-decoration: none;
}
.rtd-footer-links a:hover { 
text-decoration: underline; 
}
.rtd-footer-copy {
margin-top: 24px !important;
color: rgba(38, 34, 98, .5);
font-size: 14px;
letter-spacing: 0;
}
.rtd-kicker { 
font-size: 13px; 
font-weight: 900; 
letter-spacing: .18em; 
text-transform: uppercase; 
}
.rtd-button {
min-height: 60px;
padding: 0 64px;
border: 1px solid transparent;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 28px;
cursor: pointer;
font-weight: 800;
text-decoration: none;
transition: transform .2s ease, box-shadow .2s ease, background .2s ease, opacity .2s ease;
}
.rtd-button:hover { 
transform: translateY(-2px); 
}
.rtd-button:focus-visible, .rtd-option:focus-visible, .rtd-app input:focus-visible { 
outline: 3px solid rgba(112, 87, 255, .3); 
outline-offset: 3px; 
}
.rtd-button-main { 
color: var(--rtd-white); 
background: var(--rtd-ink); 
box-shadow: 0 12px 30px rgba(16, 20, 35, .18); 
}
.rtd-button-main span, .rtd-button-submit span { 
font-size: 22px; 
line-height: 1; 
}
.rtd-button:disabled { 
opacity: .35; 
cursor: not-allowed; 
box-shadow: none; 
transform: none; 
}
.rtd-button-back { 
color: var(--rtd-ink); 
background: transparent; 
border-color: var(--rtd-line); 
}
.rtd-alert { 
margin-bottom: 24px; 
padding: 15px 18px; 
border: 1px solid #efb4b4; 
border-radius: 12px; 
color: #8b2626; 
background: #fff3f3; 
font-weight: 700; 
font-size: 14px; 
}
.rtd-noscript { 
max-width: 720px; 
margin: 40px auto; 
padding: 20px; 
background: #fff3f3; 
} .rtd-hero { 
max-width: 1360px; 
min-height: 720px; 
margin: 56px auto; 
padding: 70px 36px 70px; 
position: relative; 
display: flex; 
align-items: center; 
overflow: hidden; 
isolation: isolate; 
}
.rtd-hero::after { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: linear-gradient(90deg, var(--rtd-paper) 0%, rgba(244, 241, 234, .98) 31%, rgba(244, 241, 234, .76) 45%, rgba(244, 241, 234, 0) 64%); }
.rtd-hero-copy { 
width: min(52%, 640px);
position: relative; 
z-index: 2; 
}
.rtd-diagnosis-name {
width: fit-content;
margin-bottom: 13px !important;
padding: 7px 14px !important;
display: inline-flex;
align-items: center;
gap: 9px;
border: 1px solid rgba(112, 87, 255, .24);
border-radius: 999px;
color: var(--rtd-ink);
background: rgba(255, 255, 255, .72);
font-size: 13px;
font-weight: 900;
line-height: 1.4;
letter-spacing: .08em;
white-space: nowrap;
}
.rtd-diagnosis-name span {
width: 8px;
height: 8px;
flex: 0 0 8px;
border-radius: 50%;
background: var(--rtd-accent);
box-shadow: 0 0 0 4px rgba(112, 87, 255, .12);
}
.rtd-hero-copy .rtd-kicker { 
color: var(--rtd-accent); 
margin-bottom: 18px; 
}
.rtd-hero h1 { 
font-size: clamp(46px, 6vw, 82px); 
line-height: 1.09; 
letter-spacing: -.04em; 
font-weight: 900; 
}
.rtd-hero h1 em { 
color: var(--rtd-accent); 
font-style: normal; 
position: relative;
}
.rtd-hero h1 em::after { 
content: ""; 
position: absolute; 
height: 9px; 
left: 2px; 
right: 2px; 
bottom: 1px; 
background: var(--rtd-lime); 
z-index: -1; 
transform: rotate(-1deg); 
}
.rtd-lead { 
max-width: 570px; 
margin: 28px 0 34px !important; 
color: var(--rtd-muted); 
font-size: 17px; 
line-height: 1.9; 
}
.rtd-micro { 
margin-top: 14px !important; 
padding-left: 25px !important;
color: var(--rtd-muted); 
font-size: 11px; 
letter-spacing: .08em; 
}
.rtd-hero-visual { 
margin: 0; 
position: absolute; 
z-index: 0; 
inset: 0; 
pointer-events: none; 
}
.rtd-hero-visual picture { 
width: 100%; 
height: 100%; 
display: block; 
}
.rtd-hero-visual img { 
width: 100%; 
height: 100%; 
display: block; 
object-fit: cover; 
object-position: center; 
}
.rtd-intro-strip { 
border-top: 1px solid var(--rtd-line); 
border-bottom: 1px solid var(--rtd-line); 
display: grid; 
grid-template-columns: repeat(3, 1fr); 
max-width: 1168px; 
margin: 0 auto; 
}
.rtd-intro-strip > div { 
padding: 25px 32px; 
display: flex; 
align-items: center; 
gap: 18px; 
border-right: 1px solid var(--rtd-line); 
}
.rtd-intro-strip > div:last-child { 
border-right: 0; 
}
.rtd-intro-strip b { 
color: var(--rtd-accent); 
font-size: 12px; 
}
.rtd-intro-strip span { 
font-size: 13px; 
font-weight: 800; 
} .rtd-question-page { 
width: min(900px, calc(100% - 48px)); 
margin: 0 auto; 
padding: 64px 0 20px; 
}
.rtd-progress-head { 
display: flex; 
align-items: flex-end; 
justify-content: space-between; 
}
.rtd-progress-head div { 
display: flex; 
flex-direction: column; 
gap: 4px;
}
.rtd-progress-head span { 
color: var(--rtd-accent); 
font-size: 10px; 
font-weight: 900; 
letter-spacing: .18em; 
}
.rtd-progress-head strong { 
font-size: 24px;
}
.rtd-progress-head > b { 
font-size: 12px; 
color: var(--rtd-muted); 
}
.rtd-progress { 
height: 5px; 
margin-top: 16px; 
background: rgba(16, 20, 35, .09); 
border-radius: 99px; 
overflow: hidden; 
}
.rtd-progress i { 
display: block; 
height: 100%; 
background: var(--rtd-accent); 
border-radius: inherit; 
transition: width .35s ease; 
}
.rtd-question-guide { 
margin: 22px 0 32px !important; 
color: var(--rtd-muted); 
font-size: 13px; 
}
.rtd-question-list { 
display: grid; 
gap: 22px; }
.rtd-question { 
padding: 28px; 
background: rgba(255, 255, 255, .62); 
border: 1px solid var(--rtd-line); 
border-radius: 18px; 
}
.rtd-question legend { 
width: 100%; 
margin-bottom: 18px; color: var(--rtd-ink); 
font-size: 17px; 
font-weight: 900; 
line-height: 1.55; 
}
.rtd-question legend > span { 
margin-right: 13px; 
color: var(--rtd-accent); 
font-size: 11px; 
letter-spacing: .08em;
}
.rtd-options { 
display: grid; 
grid-template-columns: 1fr 1fr; 
gap: 10px; 
}
.rtd-option { 
min-height: 70px; 
width: 100%; 
padding: 12px 44px 12px 12px; 
border: 1px solid rgba(16, 20, 35, .12); 
border-radius: 12px; 
position: relative; 
display: flex; 
align-items: center; 
gap: 12px; 
color: var(--rtd-ink); 
background: var(--rtd-white); 
text-align: left; 
line-height: 1.5; 
cursor: pointer; 
transition: border .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease; 
}
.rtd-option:hover { 
border-color: rgba(112, 87, 255, .45); 
transform: translateY(-1px); 
}
.rtd-option.is-selected { 
border-color: var(--rtd-accent); 
background: #f2efff; 
box-shadow: 0 0 0 1px var(--rtd-accent); 
}
.rtd-option-letter { 
width: 30px; 
height: 30px; 
flex: 0 0 30px; 
display: grid; 
place-items: center; 
border-radius: 50%; 
background: var(--rtd-paper); 
font-size: 11px; 
font-weight: 900; 
}
.rtd-option.is-selected .rtd-option-letter { 
color: var(--rtd-white); 
background: var(--rtd-accent); 
}
.rtd-option-check { 
position: absolute; 
right: 16px; 
color: var(--rtd-accent); 
opacity: 0; 
font-weight: 900; 
}
.rtd-option.is-selected .rtd-option-check { 
opacity: 1; 
}
.rtd-actions { 
position: sticky; 
z-index: 4; 
bottom: 0; 
margin-top: 28px; 
padding: 18px 0; 
display: flex; 
justify-content: space-between; 
gap: 14px; 
background: linear-gradient(0deg, var(--rtd-paper) 78%, rgba(244, 241, 234, 0)); 
}
.rtd-actions .rtd-button-main { 
min-width: 220px; 
}
.rtd-inline-error { 
color: #a32626; 
font-size: 13px; 
} .rtd-loading { 
min-height: 620px; 
padding: 100px 24px; 
display: flex; 
flex-direction: column; 
align-items: center; 
justify-content: center; text-align: center; 
}
.rtd-loading .rtd-kicker {
margin-top: 38px; 
color: var(--rtd-accent); 
}
.rtd-loading h2 {
margin-top: 9px; 
font-size: clamp(28px, 4vw, 46px); 
letter-spacing: -.04em; 
}
.rtd-loading > p:last-child { 
color: var(--rtd-muted); 
font-size: 13px; 
}
.rtd-loading-bar { 
width: min(360px, 80vw); 
height: 4px; 
margin: 30px 0 18px;
background: rgba(16, 20, 35, .1); 
overflow: hidden; 
}
.rtd-loading-bar i { 
display: block; 
width: 35%; 
height: 100%; 
background: var(--rtd-accent); 
animation: rtd-load 1.1s ease-in-out infinite; 
}
@keyframes rtd-spin { 
to { transform: rotate(360deg); } 
}
@keyframes rtd-load { 
0% { transform: translateX(-100%); } 
100% { transform: translateX(380%); } 
} .rtd-form-page { 
max-width: 1120px; 
margin: 0 auto; 
padding: 72px 36px 26px; 
display: grid; 
grid-template-columns: .76fr 1.24fr; 
gap: 72px; 
align-items: start; 
}
.rtd-form-heading { 
position: sticky; 
top: 40px; 
}
.rtd-form-heading .rtd-kicker { 
color: var(--rtd-accent); 
margin-bottom: 16px; 
}
.rtd-form-heading h1 { 
font-size: clamp(36px, 4.2vw, 58px); 
line-height: 1.22; 
letter-spacing: -.055em; 
}
.rtd-form-heading > p:last-child { 
margin-top: 24px !important; 
color: var(--rtd-muted); 
line-height: 1.9; 
}
.rtd-form-card { 
padding: 34px; 
background: var(--rtd-white); 
border: 1px solid var(--rtd-line); 
border-radius: 22px; 
box-shadow: 0 18px 55px rgba(16, 20, 35, .08); 
}
.rtd-form { 
display: grid; 
grid-template-columns: 1fr 1fr; 
gap: 24px 16px; 
}
.rtd-field { 
display: flex; 
flex-direction: column;
gap: 8px; 
}
.rtd-field > span, .rtd-field legend { 
color: var(--rtd-ink); 
font-size: 13px; 
font-weight: 800; }
.rtd-field b { 
display: inline-block; 
margin-left: 5px; padding: 2px 7px; border-radius: 4px; color: #7c2929; 
background: #fff0f0; 
font-size: 9px; 
vertical-align: 1px; 
}
.rtd-field small { 
display: inline-block; 
margin-left: 5px; 
color: var(--rtd-muted); 
font-size: 10px; 
font-weight: 500; 
}
.rtd-field input[type="text"], .rtd-field input[type="tel"], .rtd-field input[type="email"], .rtd-field input[type="date"] { 
width: 100%; 
height: 52px; 
padding: 0 14px; 
border: 1px solid rgba(16, 20, 35, .16); 
border-radius: 9px; 
color: var(--rtd-ink); 
background: #fbfbfc; 
box-shadow: none; 
}
.rtd-field input::placeholder { 
color: #a1a3ab; 
}
.rtd-field-wide { 
grid-column: 1 / -1; 
}
.rtd-radio-row { 
margin-top: 9px; 
display: grid; 
grid-template-columns: 
repeat(4, 1fr); 
gap: 7px; 
}
.rtd-radio-row label { 
position: relative; 
cursor: pointer; 
}
.rtd-radio-row input { 
position: absolute; 
opacity: 0; 
pointer-events: none; 
}
.rtd-radio-row span { 
min-height: 44px; 
display: grid; 
place-items: center; 
border: 1px solid rgba(16, 20, 35, .14); 
border-radius: 8px; 
background: #fbfbfc; 
font-size: 12px; 
}
.rtd-radio-row input:checked + span { 
color: var(--rtd-white); 
background: var(--rtd-ink); 
border-color: var(--rtd-ink); 
}
.rtd-radio-row input:focus-visible + span { 
outline: 3px solid rgba(112, 87, 255, .3); 
outline-offset: 2px; 
}
.rtd-consent { 
display: flex; 
align-items: flex-start; 
gap: 10px; 
color: var(--rtd-muted); 
font-size: 12px; 
cursor: pointer; 
}
.rtd-consent input { 
width: 18px; 
height: 18px; 
margin-top: 2px; 
accent-color: var(--rtd-accent); 
}
.rtd-consent a { 
color: var(--rtd-accent); 
font-weight: 700; 
}
.rtd-button-submit { 
width: 100%; 
min-height: 62px; 
color: var(--rtd-white); 
background: var(--rtd-accent); 
box-shadow: 0 14px 30px rgba(112, 87, 255, .24); 
}
.rtd-security { 
margin-top: 12px !important; 
color: var(--rtd-muted); 
text-align: center; 
font-size: 10px; 
}
.rtd-honeypot { 
position: absolute !important; 
left: -99999px !important; 
width: 1px !important; 
height: 1px !important; 
overflow: hidden !important; 
} .rtd-result { 
--rtd-role-color: var(--rtd-accent); 
max-width: 1060px; 
margin: 0 auto; 
padding: 70px 36px 12px; 
}
.rtd-result-hero { 
min-height: 560px; 
padding: 60px; 
position: relative; 
overflow: hidden; 
display: grid; 
grid-template-columns: minmax(0, 1.16fr) minmax(280px, .84fr); 
align-items: center; 
gap: 28px; 
color: var(--rtd-white); 
background: var(--rtd-ink); border-radius: 28px; 
}
.rtd-result-hero::after { 
content: ""; 
position: absolute; 
width: 320px; 
height: 320px; 
right: -90px; 
top: -100px; 
border: 1px solid rgba(255,255,255,.15); 
border-radius: 50%; 
box-shadow: 0 0 0 60px rgba(255,255,255,.035), 0 0 0 120px rgba(255,255,255,.025);
}
.rtd-result-copy { 
min-width: 0; 
position: relative; 
z-index: 2; 
}
.rtd-result-hero .rtd-kicker { 
color: var(--rtd-lime); 
}
.rtd-result-code { 
margin-top: 26px; 
color: var(--rtd-role-color); 
font-size: clamp(64px, 8vw, 118px); 
line-height: .88; 
letter-spacing: -.03em;
font-weight: 950; 
}
.rtd-result-hero h1 { 
margin-top: 20px; 
font-size: clamp(37px, 5.4vw, 64px); 
line-height: 1.1; 
letter-spacing: -.05em; 
}
.rtd-result-hero h1 small {
margin-left: 8px; 
font-size: .34em; 
letter-spacing: 0; 
}
.rtd-result-catch { 
margin-top: 18px !important; 
font-size: 19px; 
font-weight: 800; 
}
.rtd-result-description {
max-width: 720px; 
margin-top: 18px !important;
color: rgba(255,255,255,.72); 
line-height: 1.9; 
}
.rtd-result-character { 
width: min(100%, 410px); 
aspect-ratio: 1; 
margin: 0; 
position: relative; 
z-index: 2; 
justify-self: end; 
overflow: hidden; 
border: 7px solid rgba(255,255,255,.14); 
border-radius: 50%; 
background: var(--rtd-paper); 
box-shadow: 0 24px 60px rgba(0,0,0,.32), 0 0 0 1px var(--rtd-role-color); 
}
.rtd-result-character img { 
width: 100%;
height: 100%; 
display: block; 
object-fit: cover; 
transform: scale(1.04);
}
.rtd-result-grid {
margin-top: 22px; 
display: grid; 
grid-template-columns: 1fr 1fr; 
gap: 22px; 
}
.rtd-result-card { 
min-height: 260px; 
padding: 30px; 
position: relative; 
background: var(--rtd-white);
border: 1px solid var(--rtd-line); 
border-radius: 18px; 
}
.rtd-card-number { 
position: absolute; 
top: 24px; 
right: 26px; 
color: var(--rtd-role-color); 
font-size: 11px; 
font-weight: 900; 
}
.rtd-result-card h2 { 
margin-bottom: 24px; 
font-size: 20px; 
letter-spacing: -.03em; 
}
.rtd-result-card p { 
color: var(--rtd-muted); 
line-height: 1.9; 
}
.rtd-tag-list { 
display: flex; 
flex-wrap: wrap; 
gap: 10px; 
}
.rtd-tag-list span { 
padding: 10px 14px; 
border-radius: 999px; 
color: var(--rtd-ink); 
background: var(--rtd-lime); 
font-size: 12px; 
font-weight: 800; 
}
.rtd-result-card ul { 
list-style: none; 
display: grid; 
gap: 9px; 
}
.rtd-result-card li { 
padding: 11px 14px; 
border-left: 3px solid var(--rtd-role-color); 
background: var(--rtd-paper); 
font-size: 13px; 
font-weight: 700; 
}
.rtd-axis { 
margin-top: 17px; 
}
.rtd-axis > div:first-child { 
display: grid; 
grid-template-columns: 1fr 1.1fr 1fr; 
gap: 6px; 
align-items: end; color: var(--rtd-muted); font-size: 9px; 
}
.rtd-axis > div:first-child span:last-child { 
text-align: right; 
}
.rtd-axis > div:first-child b { 
color: var(--rtd-ink); 
text-align: center; 
font-size: 11px; 
}
.rtd-axis-track { 
height: 4px; 
margin-top: 8px; 
position: relative; 
background: #dddde2; 
}
.rtd-axis-track::after { 
content: ""; 
position: absolute; 
left: 50%; 
top: -3px; 
width: 1px; 
height: 10px; 
background: #a4a6ad; 
}
.rtd-axis-track i { 
width: 13px; 
height: 13px; 
position: absolute; 
top: 50%; 
border: 3px solid var(--rtd-white); 
border-radius: 50%; 
box-shadow: 0 0 0 1px rgba(16,20,35,.18); transform: translate(-50%, -50%); 
}
.rtd-secondary { 
margin-top: 22px; 
padding: 35px 40px; 
display: flex; 
align-items: center; 
justify-content: space-between; 
gap: 30px; 
background: #e9e4ff; 
border-radius: 18px; 
}
.rtd-secondary .rtd-kicker { 
color: var(--rtd-accent); 
}
.rtd-secondary h2 { 
margin-top: 8px; 
font-size: 24px; 
}
.rtd-secondary h2 em { 
color: var(--rtd-accent); 
font-style: normal;
}
.rtd-secondary p:last-child {
max-width: 690px; 
margin-top: 10px !important; 
color: var(--rtd-muted); 
font-size: 13px; 
}
.rtd-secondary > strong { 
min-width: 110px; 
color: var(--rtd-accent); 
font-size: 23px; 
text-align: center; 
}
.rtd-watchout { 
margin-top: 22px; 
padding: 32px 38px;
border: 1px solid var(--rtd-line); 
border-radius: 18px; 
}
.rtd-watchout > span { 
color: var(--rtd-role-color); 
font-size: 10px; 
font-weight: 900; 
letter-spacing: .16em;
}
.rtd-watchout h2 { 
margin-top: 6px; 
font-size: 20px;
}
.rtd-watchout p { 
margin-top: 11px !important; 
color: var(--rtd-muted); 
}
.rtd-result-actions { 
padding: 42px 0 0; 
display: flex; 
align-items: center; 
justify-content: space-between; 
gap: 18px; 
}
.rtd-result-actions p { 
color: var(--rtd-muted); 
font-size: 12px;
}
@media (max-width: 820px) {
.rtd-header { 
min-height: 64px; 
padding: 0 20px; 
}
.rtd-header-note { 
display: none; 
}
.rtd-footer {
margin-top: 35px; 
padding: 48px 0 56px; 
}
.rtd-footer::before { 
top: -35px; 
border-width: 0 0 36px 100vw; 
}
.rtd-footer-inner { 
padding: 0 16px; 
}
.rtd-footer-logo { 
width: 240px; 
}
.rtd-hero { 
min-height: auto; 
padding: 48px 24px 44px; 
flex-direction: column; 
align-items: stretch; 
gap: 28px; 
}
.rtd-hero::after { 
display: none; 
}
.rtd-hero-copy { 
width: 100%; 
display: flex;
align-items: center;
flex-flow: column;
}
.rtd-hero-visual { 
width: calc(100% + 48px); 
margin: 0 -24px -10px; 
position: relative; 
inset: auto; 
}
.rtd-hero-visual picture { 
height: auto; 
}
.rtd-hero-visual img { 
width: 100%; height: auto; 
object-fit: contain; 
}
.rtd-intro-strip { 
margin: 0 20px; 
}
.rtd-intro-strip > div { 
padding: 18px 12px; 
flex-direction: column; 
gap: 5px; 
text-align: center; 
}
.rtd-question-page { 
width: min(100% - 32px, 700px); 
padding-top: 42px; 
}
.rtd-options { 
grid-template-columns: 1fr; 
}
.rtd-form-page {
padding: 48px 22px 10px; 
grid-template-columns: 1fr; 
gap: 34px; 
}
.rtd-form-heading { 
position: static; 
}
.rtd-form-heading h1 br { 
display: none; 
}
.rtd-result { 
padding: 42px 20px 10px; 
}
.rtd-result-hero { 
min-height: 0; 
padding: 42px 30px; 
grid-template-columns: 1fr; 
gap: 32px; 
}
.rtd-result-character { 
width: min(72vw, 330px); 
justify-self: center; 
}
.rtd-result-grid { 
grid-template-columns: 1fr; 
}
}
@media (max-width: 560px) {
.rtd-footer-links { 
flex-direction: column; 
gap: 8px; 
}
.rtd-footer-links a, .rtd-footer-copy { 
font-size: 12px; 
}
.rtd-diagnosis-name { 
padding: 6px 11px !important; 
font-size: 12px; 
letter-spacing: .06em; 
}
.rtd-hero h1 { 
font-size: 43px; 
}
.rtd-lead { 
font-size: 15px;
}
.rtd-intro-strip span { 
font-size: 11px; 
}
.rtd-question { 
padding: 20px 15px; 
}
.rtd-question legend { 
font-size: 15px; 
}
.rtd-option { 
min-height: 64px; 
font-size: 13px; 
}
.rtd-actions .rtd-button { 
min-width: 0; 
padding: 0 19px; 
gap: 10px; 
}
.rtd-actions .rtd-button-main { 
flex: 1; 
}
.rtd-form-card { 
padding: 25px 18px; 
}
.rtd-form { 
grid-template-columns: 1fr; 
}
.rtd-field-wide { 
grid-column: auto; 
}
.rtd-radio-row { 
grid-template-columns: 1fr 1fr; 
}
.rtd-result-hero { 
padding: 36px 23px; 
}
.rtd-result-code { 
font-size: 68px; 
}
.rtd-result-hero h1 { 
font-size: 40px; 
}
.rtd-result-character { 
width: min(76vw, 270px); 
border-width: 5px; 
}
.rtd-result-card { 
min-height: auto; padding: 25px 21px; 
}
.rtd-secondary { 
padding: 28px 22px; 
flex-direction: column; 
align-items: flex-start; 
}
.rtd-secondary > strong { 
text-align: left; 
}
.rtd-watchout { 
padding: 27px 22px;
}
.rtd-result-actions { 
align-items: flex-start; 
flex-direction: column; 
}
}
@media (prefers-reduced-motion: reduce) {
.rtd-app, .rtd-app *, .rtd-app *::before, .rtd-app *::after { 
scroll-behavior: auto !important; 
animation-duration: .01ms !important; 
animation-iteration-count: 1 !important; 
transition-duration: .01ms !important; 
}
} .rtd-consent {
display: flex;
align-items: flex-start;
gap: 10px;
cursor: pointer;
line-height: 1.6;
}
.rtd-consent input[type="checkbox"] {
display: block !important;
appearance: checkbox !important;
-webkit-appearance: checkbox !important;
opacity: 1 !important;
visibility: visible !important;
position: static !important;
width: 18px !important;
height: 18px !important;
margin: 3px 0 0 !important;
flex-shrink: 0;
accent-color: #7057ff;
cursor: pointer;
}
.rtd-consent span {
display: block;
font-size: 14px;
color: #333;
}