/* Quiet typography, a single accent, and consistent controls across both surveys. */
:root{--black:#202020;--dark:#111111;--mid:#555555;--gray:#707070;--light:#808080;--muted:#c8c8c8;--white:#fff;--cream:#fff;--cream-dark:#f3f3f3;--border:#e8e8e8;--border-dark:#cecece;--accent:#272727;--accent-soft:#f5f5f5;--stone:var(--accent);--stone-light:#c4c4c4;--stone-pale:#e2e2e2}
body{font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif;background:#fff;color:var(--black);line-height:1.7;letter-spacing:-.025em}
body.survey-attention{--accent:#272727;--accent-soft:#f5f5f5;--stone-light:#c4c4c4;--stone-pale:#e2e2e2}
h1,h2,h3,h4,.serif{font-family:inherit;letter-spacing:-.04em;line-height:1.45;color:var(--black)}
p{color:var(--mid);line-height:1.85}button,input,a{font-family:inherit}.container{max-width:1056px;margin:0 auto;padding:0 48px 32px}
.header{text-align:left;padding:38px 0 40px}.page-index{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.14em;font-weight:600;color:#7c7c7c;border-bottom:1px solid var(--border);padding-bottom:20px;margin-bottom:62px}.page-index span:last-child{font-variant-numeric:tabular-nums;font-weight:400;letter-spacing:.05em}.edition-label{font-size:12px;font-weight:600;color:var(--accent);letter-spacing:.03em;margin-bottom:22px}.header h1{font-family:inherit;font-size:56px;font-weight:700;line-height:1.23;letter-spacing:-.065em}.header h1 br{display:block}.title-light{color:#939393;font-weight:400}.header-sub{font-size:15px;letter-spacing:-.03em;color:#7d7d7d;margin-top:24px}
body[data-stage="intro"] .container{display:grid;grid-template-columns:1fr 1fr;column-gap:80px}body[data-stage="intro"] .header{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:80px;padding-bottom:0}body[data-stage="intro"] .page-index{grid-column:1/-1}body[data-stage="intro"] .edition-label,body[data-stage="intro"] h1,body[data-stage="intro"] .header-sub{grid-column:1}body[data-stage="intro"] #step-intro{grid-column:2;grid-row:1;margin-top:125px;position:relative}body[data-stage="intro"] #questions{display:none}body[data-stage="intro"] footer{grid-column:1/-1;margin-top:95px}
.intro-card{display:block;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;text-align:left;background:transparent}.intro-copy{display:block}.intro-card h2{font-family:inherit;font-size:22px;font-weight:600;line-height:1.65;margin:0 0 18px;letter-spacing:-.04em}.intro-card p{font-size:14px;line-height:1.95;color:#717171}.intro-meta{display:flex;align-items:center;gap:0;margin:30px 0 0;padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);font-size:12px;color:#818181}.intro-meta span{padding:0 16px;border-right:1px solid var(--border);white-space:nowrap}.intro-meta span:first-child{padding-left:0}.intro-meta span:last-child{padding-right:0;border:0}.intro-meta b{font-size:18px;font-weight:600;color:var(--black);letter-spacing:-.05em;margin-right:2px}.intro-card .notice{font-size:11px!important;line-height:1.8;color:#838383!important;margin-top:18px}
.btn{font-family:inherit;border-radius:9px;font-size:14px;font-weight:600;min-height:52px;padding:15px 20px;letter-spacing:-.02em;transition:background .18s,border-color .18s;box-shadow:none}.btn:active{transform:none}.btn-primary,.btn-stone{background:var(--black);color:#fff;box-shadow:none}.btn-primary:hover,.btn-stone:hover{background:#3d3d3d;transform:none;box-shadow:none}.btn-full{display:flex;align-items:center;justify-content:space-between;min-height:58px;padding:18px 22px;font-size:15px}.btn-full span{font-size:22px;line-height:1;font-weight:400}.btn-secondary{flex:0 0 90px;border:1px solid var(--border-dark);background:#fff;color:#606060}.btn-secondary:hover{background:#f8f8f8;border-color:#b0b0b0}.btn-primary:disabled,.btn-stone:disabled{background:#f0f0f0;color:#a2a2a2;box-shadow:none;cursor:not-allowed}.btn-row{display:flex;gap:12px;margin-top:28px}.btn-row .btn-primary span{margin-left:14px}
body:not([data-stage="intro"]) .container{max-width:720px;padding-left:40px;padding-right:40px}body:not([data-stage="intro"]) .header{padding-top:26px;padding-bottom:16px}body:not([data-stage="intro"]) .page-index{margin-bottom:24px;padding-bottom:16px}body:not([data-stage="intro"]) .edition-label{display:none}body:not([data-stage="intro"]) .header h1{font-size:20px;font-weight:650;line-height:1.5;letter-spacing:-.04em}body:not([data-stage="intro"]) .header h1 br{display:none}body:not([data-stage="intro"]) .title-light{font-size:14px;margin-left:10px}body:not([data-stage="intro"]) .header-sub{display:none}
.progress-wrap{background:#fffffff2;backdrop-filter:blur(12px);padding:12px 0;border:0;top:0}.progress-inner{gap:18px}.progress-bar{height:3px;background:#f0f0f0}.progress-fill{background:var(--accent);height:100%}.progress-text{font-size:11px;font-variant-numeric:tabular-nums;color:#818181;letter-spacing:.04em}.sec-header{margin:32px 0 10px;padding:0;border:0}.sec-num{font-size:10px;letter-spacing:.1em;color:var(--accent);font-weight:600}.sec-title{font-family:inherit;font-size:27px;font-weight:650;margin-top:10px}.step>.notice{font-size:13px!important;line-height:1.8;color:#838383!important;margin:12px 0 18px}
.q-card{background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}.q-row{display:block;padding:26px 0;border:0;border-bottom:1px solid var(--border);background:transparent;box-shadow:none;border-radius:0;scroll-margin-top:60px}.q-row:last-child{border-bottom:1px solid var(--border)}.q-left{min-width:0}.q-num{font-size:10px;color:#929292;letter-spacing:.06em;margin-bottom:9px;font-variant-numeric:tabular-nums}.q-text{font-size:17px;line-height:1.7;font-weight:500;color:#383838;word-break:keep-all}.q-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}.q-opt{min-height:47px;padding:10px;border:1px solid #e5e5e5;border-radius:8px;background:#fff;color:#757575;font-size:13px;font-weight:500;transition:background .15s,color .15s,border-color .15s;box-shadow:none;font-family:inherit}.q-opt.sel-0,.q-opt.sel-1,.q-opt.sel-2{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:600}.q-opt[aria-pressed="true"]::before{content:'✓';margin-right:7px;font-size:12px}.q-opt:hover:not([aria-pressed="true"]){background:#f9f9f9;border-color:#c0c0c0}.q-opt:active{transform:none}.q-row.unanswered{background:#f9f9f9}
.form-card,.chart-card,.detail-card{padding:28px 0;background:#fff;border:0;border-bottom:1px solid var(--border);border-radius:0;box-shadow:none;margin-top:12px}.form-card p.lead{margin-bottom:30px}.form-card p.lead b{font-weight:500!important;font-size:15px!important;line-height:1.85}.form-card h3,.chart-card h3{font-size:20px;font-weight:600}.form-group{margin-bottom:22px}.form-group label{font-size:12px;color:#717171;letter-spacing:0;font-weight:500;margin-bottom:8px}.form-group input{border:1px solid #e4e4e4;border-radius:8px;min-height:52px;padding:14px 16px;font-size:16px;font-family:inherit;background:#fcfcfc;color:var(--black)}.form-group input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.form-group input::placeholder{color:#aaaaaa}.consent-inline{gap:9px;min-height:40px;margin:20px 0 0}.consent-inline span:last-child{font-size:12px;color:#727272}.chk-mini{width:17px;height:17px;border:1px solid #a4a4a4;border-radius:4px}.consent-inline input[type=checkbox]{top:11px}.consent-inline input:checked+.chk-mini{background:var(--black);border-color:var(--black)}
.result-hero{background:var(--accent-soft);border:0;border-radius:14px;padding:38px 30px;text-align:left;box-shadow:none;margin-top:24px}.result-hero::before{display:none}.result-hero .label{font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--accent)}.result-hero h2.type,.attention-hero h2.type{font-family:inherit;font-size:32px;font-weight:650;letter-spacing:-.055em;color:var(--black);margin:16px 0;word-break:keep-all}.result-hero .summary{font-size:14px;line-height:1.9;color:#6d6d6d;word-break:keep-all}.result-badge{background:#ffffffb3;color:var(--accent);border:1px solid #ffffff;border-radius:5px;padding:6px 10px;font-size:10px;letter-spacing:0;font-weight:500;margin-top:22px}.attention-hero .mode-mark{font-size:32px;font-family:Arial,sans-serif;line-height:1.1;margin:24px 0 0;color:var(--accent)}.mode-tagline{color:var(--accent)!important;font-size:13px!important;margin:10px 0 18px;line-height:1.8}.result-note{padding:20px 0;background:transparent;border:0;border-bottom:1px solid var(--border);border-radius:0;font-size:12px;line-height:1.9;color:#838383;word-break:keep-all}.mode-card{margin-top:8px}.mode-card h3{margin-bottom:18px;font-size:20px;font-weight:600}.mode-card p{font-size:14px;line-height:1.9;color:#6d6d6d}.scene{margin-top:16px;padding-top:16px;border-color:var(--border)}.scene span{background:var(--accent-soft);color:var(--accent);font-size:10px;padding:2px 7px;border-radius:4px;margin-right:9px}.mode-row{display:flex;gap:12px;margin:0;padding:16px 0;border-bottom:1px solid #f2f2f2;font-size:13px;color:#6d6d6d}.mode-row b{font-size:11px;font-weight:400;color:#939393}.mode-dots{gap:6px}.mode-dots i{width:8px;height:8px;background:#ededed}.mode-dots .filled{background:var(--accent)}.mode-method{font-size:12px;color:#757575;margin-top:22px}.mode-method summary{padding:5px 0}.mode-method p{font-size:12px;color:#808080}.mode-tip{display:flex;gap:14px;margin-top:18px}.mode-tip b{font-size:11px;line-height:2.5;flex-shrink:0;color:var(--accent);font-weight:500}.rhythm-card{background:#fff}.rhythm-card .label{font-size:10px;font-weight:500;color:var(--accent);letter-spacing:.05em;margin-bottom:12px}.notice{color:#838383!important}.share-row{margin-top:30px;gap:10px}.share-btn{border:1px solid var(--border-dark);border-radius:8px;padding:13px 20px;min-height:48px;font-size:12px;font-family:inherit;font-weight:500;text-decoration:none;color:#6d6d6d;background:white}.share-btn:hover{background:#f9f9f9;border-color:#b5b5b5}.share-btn:active{transform:none}footer{text-align:left;font-size:10px;color:#969696;line-height:1.8;padding:28px 0 0}footer a{color:inherit;text-decoration:none;border-bottom:1px solid #e0e0e0}.loading{padding:100px 0}.loading p{font-size:14px;color:#787878}.spinner{width:24px;height:24px;border-top-color:var(--accent)}
button:focus-visible,.share-btn:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:760px){.container{padding:0 24px 28px;max-width:520px}body[data-stage="intro"] .container{display:block}body[data-stage="intro"] .header{display:block;padding-top:24px}.page-index{margin-bottom:40px;padding-bottom:17px}body[data-stage="intro"] .page-index{margin-bottom:42px}.edition-label{font-size:11px;margin-bottom:16px}.header h1{font-size:42px;line-height:1.25}.header-sub{font-size:13px;margin-top:18px}body[data-stage="intro"] #step-intro{margin-top:42px}.intro-card h2{font-size:18px;line-height:1.7;margin-bottom:14px}.intro-card p{font-size:13px;line-height:1.9}.intro-meta{margin-top:24px;padding:17px 0;font-size:11px}.intro-meta span{padding:0 14px}.intro-meta b{font-size:17px}.intro-card .notice{font-size:10px!important;margin-top:16px;line-height:1.8}.btn-full{min-height:56px;font-size:14px}.btn-row{margin-top:24px}body[data-stage="intro"] footer{margin-top:30px;text-align:center}body:not([data-stage="intro"]) .container{padding:0 24px 28px;max-width:520px}body:not([data-stage="intro"]) .header{padding-top:22px}body:not([data-stage="intro"]) .page-index{margin-bottom:20px}body:not([data-stage="intro"]) .header h1{font-size:18px}body:not([data-stage="intro"]) .title-light{font-size:12px;margin-left:8px}.sec-header{margin-top:24px}.sec-title{font-size:24px}.step>.notice{font-size:12px!important}.q-row{padding:23px 0}.q-text{font-size:16px;line-height:1.7}.q-opts{margin-top:16px}.q-opt{font-size:12px;min-height:46px}.result-hero{padding:28px 24px;margin-top:16px}.result-hero h2.type,.attention-hero h2.type{font-size:29px}.mode-row{gap:9px}.mode-dots{gap:5px}.form-card,.chart-card,.detail-card{padding:26px 0}.form-card h3{font-size:19px}.share-btn{flex:1;text-align:center;padding:13px 12px}}
@media(min-width:761px) and (max-width:1000px){body[data-stage="intro"] .container,body[data-stage="intro"] .header{column-gap:48px}.header h1{font-size:46px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:761px){body[data-stage="intro"] .header{grid-row:1;align-self:start;align-content:start}body[data-stage="intro"] footer{grid-row:2;margin-top:80px}}
/* A restrained finishing pass; keep the monochrome layout and spacing. */
.edition-label{display:inline-flex;align-items:center;justify-self:start;gap:7px}
.edition-label::before{content:'';width:5px;height:5px;flex:none;border-radius:50%;background:#737373}
.intro-meta{background:linear-gradient(110deg,#fafafa,#fff);border:1px solid #ededed;border-radius:10px;padding-left:14px;padding-right:14px}
.btn-primary:not(:disabled),.btn-stone:not(:disabled){background:linear-gradient(135deg,#303030,#202020);box-shadow:0 3px 8px #0000000b,inset 0 1px 0 #ffffff12;border-radius:11px}
.btn-secondary,.share-btn{border-radius:10px}
.q-opt{border-radius:10px;box-shadow:0 1px 2px #00000003}
.q-opt.sel-0,.q-opt.sel-1,.q-opt.sel-2{background:linear-gradient(135deg,#f8f8f8,#f1f1f1);box-shadow:0 2px 5px #00000006}
.result-hero{background:linear-gradient(135deg,#f7f7f7,#f2f2f2);border:1px solid #ebebeb;border-radius:17px;box-shadow:0 3px 14px #00000003}
@media(max-width:360px){.intro-meta span{padding-left:10px;padding-right:10px}}
/* Five frequency choices for the attention questionnaire only. */
.survey-attention .q-opts{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.survey-attention .q-opt{display:flex;flex-direction:column;gap:5px;padding:10px 2px;min-height:61px;font-size:11px;white-space:normal;line-height:1.35}
.survey-attention .q-opt[aria-pressed="true"]::before{display:none}
.survey-attention .q-opt[aria-pressed="true"]{background:#292929;color:#fff;border-color:#292929;box-shadow:none}
.answer-score{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.response-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;margin-top:14px}
.part-score{margin:22px 0}.part-score>div:first-child{display:flex;justify-content:space-between;font-size:13px;margin-bottom:9px}.part-score b{font-size:13px;font-weight:600}.part-score small{font-weight:400;color:#888}.score-track{height:5px;border-radius:8px;overflow:hidden;background:#eee}.score-track>span{display:block;height:100%;background:#414141;border-radius:8px}.type-reading .label{font-size:10px;letter-spacing:.08em;color:#777;margin-bottom:10px}.type-reading p+p{margin-top:20px}
@media(max-width:360px){.survey-attention .q-opt{font-size:10px}.survey-attention .q-opts{gap:4px}}
/* Five questions, one consistent reading rhythm. */
.start-guide{margin-top:20px;font-size:12px!important;color:#555!important}.consent-help{font-size:11px;line-height:1.85;color:#777;margin:0 0 12px 26px}
body[data-stage^="q"] .page-index,body[data-stage^="q"] footer{display:none}
body[data-stage^="q"] .header{padding:24px 0 8px}body[data-stage^="q"] .header h1{font-size:17px}body[data-stage^="q"] .header .title-light{font-size:17px;margin-left:5px;color:#333}
.group-heading{margin:25px 0 4px}.group-heading h2{font-size:14px;font-weight:400;color:#777;outline:none;letter-spacing:-.025em}
.grouped-step .q-row{padding:25px 0;border-bottom:1px solid #ededed}.question-line{display:flex;align-items:baseline;gap:12px}.grouped-step .q-num{flex:0 0 19px;margin:0;font-size:12px;color:#999;letter-spacing:0}.grouped-step .q-text{margin:0;font-size:17px;font-weight:500;line-height:1.65;color:#282828;word-break:keep-all}
.grouped-step .q-opts{margin:15px 0 0 31px;gap:6px}.grouped-step .q-opt,.survey-attention .grouped-step .q-opt{display:flex;align-items:center;justify-content:center;min-height:46px;padding:10px 3px;font-size:12px;font-weight:500;line-height:1.35;background:#f8f8f8;border:1px solid #ededed;color:#646464;border-radius:8px;box-shadow:none;white-space:nowrap}
.grouped-step .q-opt[aria-pressed="true"]{background:#292929;border-color:#292929;color:white}.grouped-step .q-opt::before{display:none!important}.group-nav{margin:28px 0 32px}.group-nav .btn-primary{flex:1}.progress-text{min-width:34px}.progress-wrap{border-radius:0}
@media(max-width:760px){body:not([data-stage="intro"]) .container{padding-left:20px;padding-right:20px}.group-heading{margin-top:18px}.group-heading h2{font-size:13px}.grouped-step .q-row{padding:22px 0}.grouped-step .q-text{font-size:16px}.grouped-step .q-opts{margin-left:0;margin-top:14px}.question-line{gap:8px}.grouped-step .q-num{flex-basis:18px}.grouped-step .q-opt,.survey-attention .grouped-step .q-opt{font-size:11px;min-height:45px}.group-nav{margin-top:24px}}
@media(max-width:360px){.survey-attention .grouped-step .q-opt{font-size:10px}.grouped-step .q-opts{gap:4px}}

/* Quiet brown accents; questions and answers share one clean left edge. */
:root,body.survey-attention{--accent:#634a3a;--accent-soft:#f6f2ee;--stone:#634a3a}
.grouped-step .question-line{display:block}.grouped-step .q-opts{margin-left:0}
.grouped-step .q-opt[aria-pressed="true"],.survey-attention .grouped-step .q-opt[aria-pressed="true"]{background:#eee6de;border-color:#8c6e56;color:#493326;font-weight:600}
.progress-fill{background:#8c6e56}
.edition-label::before{background:#9a7e67}
.btn-primary:not(:disabled),.btn-stone:not(:disabled){background:#50392c;box-shadow:0 2px 6px #50392c12}
.btn-primary:not(:disabled):hover,.btn-stone:not(:disabled):hover{background:#3e2b21}
.result-hero{background:#f8f5f1;border-color:#e7ded4}

/* The introduction is a single quiet column with one clear action. */
body[data-stage="intro"] .container{display:block;max-width:600px;padding:72px 40px 28px}
body[data-stage="intro"] .header{display:block;padding:0;margin:0 0 32px}
body[data-stage="intro"] .header h1{font-size:40px;line-height:1.3;letter-spacing:-.055em}
body[data-stage="intro"] .header h1 br{display:none}
body[data-stage="intro"] .title-light{font-size:inherit;font-weight:inherit;color:inherit;margin-left:8px}
body[data-stage="intro"] #step-intro{margin:0}
body[data-stage="intro"] .intro-card h2{font-size:20px;line-height:1.65;margin-bottom:16px}
body[data-stage="intro"] .intro-card p{font-size:14px;line-height:1.9;color:#7d7771}
body[data-stage="intro"] .intro-card .intro-duration{font-size:12px;margin-top:26px;color:#7f6857}
body[data-stage="intro"] #step-intro>.notice{font-size:11px!important;line-height:1.75;margin:16px 0 0;color:#928c86!important}
body[data-stage="intro"] footer{margin-top:24px;padding-top:0;text-align:left}
@media(max-width:760px){body[data-stage="intro"] .container{padding:48px 24px 24px;max-width:520px}body[data-stage="intro"] .header{padding:0;margin-bottom:28px}body[data-stage="intro"] .header h1{font-size:31px}body[data-stage="intro"] .intro-card h2{font-size:18px}body[data-stage="intro"] .intro-card p{font-size:13px}body[data-stage="intro"] .intro-card .intro-duration{margin-top:24px}}
@media(max-width:360px){body[data-stage="intro"] .header h1{font-size:28px}}