.challenge-page{color:#102b35;background:#f1f5f4;min-height:100vh}.challenge-shell{grid-template-columns:minmax(330px,.72fr) minmax(600px,1.28fr);max-width:1440px;min-height:calc(100vh - 92px);margin:auto;display:grid}.challenge-summary{background:#e9f8f6;border-right:1px solid #badbd8;padding:48px}.challenge-summary>p{color:#087e82;letter-spacing:.17em;margin:0;font-size:12px;font-weight:900}.challenge-summary h1{margin:14px 0 12px;font-size:42px;line-height:1.05}.challenge-summary h1 em{color:#db4b45;font-style:normal}.challenge-summary>span{color:#60767a}.skill-map{grid-template-columns:1fr 1fr;gap:9px;margin:30px 0;display:grid}.skill-map div{background:#fff;border-left:4px solid #11a3a5;gap:4px;padding:13px;display:grid}.skill-map strong{font-size:13px}.skill-map span{color:#6b7f83;font-size:11px}.score-guide{color:#fff;background:#10323c;border-radius:14px;gap:10px;padding:18px;display:grid}.score-guide>b{letter-spacing:.12em;font-size:12px}.score-guide span{font-size:12px}.score-guide i{border-radius:50%;width:9px;height:9px;margin-right:8px;display:inline-block}.score-guide .green{background:#36c99c}.score-guide .amber{background:#f5bd42}.score-guide .red{background:#ef645e}.challenge-paper{background:#f7f1e7;padding:34px 44px}.paper-head{background:#fff;border-top:6px solid #087f83;border-radius:20px 20px 0 0;justify-content:space-between;align-items:center;padding:24px 28px;display:flex}.paper-head small{color:#dc4e48;letter-spacing:.13em;font-size:10px;font-weight:900}.paper-head h2{margin:5px 0 0;font-size:26px}.paper-head>div:last-child{text-align:right;display:grid}.paper-head>div:last-child strong{font-size:22px}.paper-head>div:last-child span{color:#718286;font-size:10px}.question-nav{background:#1265c5;grid-template-columns:repeat(10,1fr);gap:5px;padding:14px;display:grid}.question-nav button{color:#fff;background:#ffffff26;border:0;border-radius:8px;height:34px;font-weight:900}.question-nav button.active{outline:3px solid #f7c736}.question-nav button.answered{background:#0a3f83}.question-nav button.correct{background:#159a78}.question-nav button.wrong{background:#d94c4c}.question-card,.result-card{background:#fff;border-radius:0 0 20px 20px;min-height:430px;padding:30px;box-shadow:0 14px 35px #11333b14}.question-card>header{justify-content:space-between;display:flex}.question-card>header span{color:#087e82;letter-spacing:.15em;text-transform:uppercase;font-size:11px;font-weight:900}.question-card>header b{color:#6e8185;font-size:11px}.question-card h3{margin:24px 0;font-size:23px;line-height:1.35}.listen-button{color:#075f65;background:#dff3f1;border:0;border-radius:12px;align-items:center;gap:10px;padding:12px 18px;font-weight:900;display:flex}.listen-button span{color:#fff;background:#0b9294;border-radius:50%;place-items:center;width:29px;height:29px;display:grid}.challenge-options{gap:10px;display:grid}.challenge-options button{text-align:left;color:#18363e;background:#fff;border:2px solid #d9e4e3;border-radius:12px;min-height:52px;padding:13px 16px}.challenge-options button.selected{background:#edf5ff;border-color:#1265c5;box-shadow:0 0 0 3px #1265c519}.visual-options{grid-template-columns:repeat(3,1fr)}.visual-options button{text-align:center}.visual-options span{margin-bottom:5px;font-size:34px;display:block}.code-answer{gap:8px;display:grid}.code-answer input{letter-spacing:.08em;text-transform:uppercase;border:2px solid #cddcda;border-radius:12px;height:58px;padding:0 16px;font-size:22px;font-weight:900}.code-answer small{color:#6e8084}.question-card footer{justify-content:space-between;margin-top:30px;display:flex}.question-card footer button,.retake{border:0;border-radius:10px;padding:12px 18px;font-weight:900}.question-card footer .next{color:#fff;background:#1265c5}.question-card footer .submit,.retake{color:#fff;background:#dc4e48}.question-card footer button:disabled{opacity:.35}.submit-note{text-align:right;color:#9a6965;font-size:11px}.result-card{text-align:center}.result-card>small{color:#087e82;letter-spacing:.14em;font-weight:900}.result-card>strong{margin:18px;font-size:72px;line-height:1;display:block}.result-card>strong em{color:#6f8184;font-size:22px;font-style:normal}.result-card h3{margin:0 0 8px;font-size:27px}.result-card>p{color:#61767a}.result-skills{grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0;display:grid}.result-skills div{background:#eef6f5;border-radius:8px;justify-content:space-between;padding:10px;font-size:12px;display:flex}.review-list{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:20px;display:grid}.review-list button{text-align:left;border:0;border-radius:7px;padding:8px}.review-list .correct{color:#14765d;background:#e1f5ec}.review-list .wrong{color:#a63e39;background:#fee7e5}@media (width<=1000px){.challenge-shell{grid-template-columns:1fr}.challenge-summary{padding:30px 24px}.challenge-paper{padding:24px 16px}}@media (width<=650px){.challenge-summary h1{font-size:34px}.challenge-paper{padding:12px 8px}.paper-head{padding:20px 16px}.question-nav{grid-template-columns:repeat(5,1fr)}.question-card,.result-card{padding:22px 16px}.visual-options,.result-skills,.review-list{grid-template-columns:1fr}.question-card h3{font-size:20px}}
