/* NETOP only: hub and CBT, no styles applied to other courses. */
body.netop{--ink:#142e46;--navy:#081c30;--accent:#087b83;--muted:#526b7e;--line:#d8e4ed;margin:0;background:#f2f6fa;color:var(--ink);font-family:"Pretendard","Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif;line-height:1.7}
.netop *{box-sizing:border-box}.netop [hidden]{display:none!important}.netop h1,.netop h2,.netop h3{line-height:1.4;letter-spacing:-.035em;margin:0 0 16px}.netop h1{font-size:clamp(28px,4.5vw,50px)}.netop p{margin:0 0 16px}.netop a{color:var(--accent);text-underline-offset:4px}.netop button,.netop input{font:inherit}.netop button,.netop .button{min-height:46px;padding:11px 18px;border:1px solid #b5cbd7;border-radius:10px;background:#fff;color:var(--ink);font-size:14px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}.netop button:hover:not(:disabled),.netop .button:hover{background:#edf7f8;border-color:var(--accent)}.netop button.primary,.netop .button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.netop button:disabled{opacity:.55;cursor:default}.netop :is(a,button,input,summary):focus-visible{outline:3px solid #b97709;outline-offset:4px}.netop .skip{position:absolute;top:-100px;left:16px;background:#fff;padding:12px;z-index:10}.netop .skip:focus{top:12px}.netop .wrap,.netop main{width:min(1200px,calc(100% - 48px));margin:auto}.netop header{background:var(--navy);color:#fff;border-bottom:1px solid #24455d}.netop .head{min-height:82px;display:flex;gap:20px;align-items:center;justify-content:space-between;padding:16px 0}.netop header a{color:#daedf5;text-decoration:none}.netop .brand{display:flex;align-items:center;gap:12px}.netop .brand-mark{border:1px solid #568295;border-radius:12px;padding:9px;font-weight:900;letter-spacing:.06em}.netop .brand strong,.netop .brand small{display:block}.netop .brand small{font-size:11px;color:#b6cadb}.netop .head nav,.netop nav.actions{display:flex;gap:12px;flex-wrap:wrap}.netop .head nav{font-size:13px}.netop .hero{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center;padding:58px 0 42px}.netop .eyebrow{font-size:12px;font-weight:800;letter-spacing:.13em;color:var(--accent);margin-bottom:14px}.netop .hero .lead{font-size:17px;color:var(--muted);max-width:650px}.netop .tags{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.netop .tag{font-size:12px;font-weight:700;background:#e1f2f1;color:#07575f;border-radius:20px;padding:5px 12px}.netop .board{background:radial-gradient(circle at 100% 0,#115366,transparent 75%),var(--navy);color:#fff;padding:30px;border:1px solid #275369;border-radius:22px;box-shadow:0 20px 45px #0d2b4220}.netop .board .eyebrow{color:#73dcd4}.netop .network{width:100%;height:auto;margin:12px 0 22px}.netop .metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.netop .metrics strong{font-size:30px;display:block}.netop .metrics small{display:block;font-size:12px;color:#c8dbe6}.netop .section-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin:40px 0 24px}.netop .section-head h2{font-size:27px;margin:0}.netop .section-head p{font-size:14px;color:var(--muted);margin:0}.netop .lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.netop .lesson-card,.netop .panel,.netop article.question-panel,.netop #quiz aside,.netop #result{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px;box-shadow:0 8px 28px #17344b06;min-width:0}.netop .lesson-card{display:flex;flex-direction:column;border-top:3px solid var(--accent);transition:transform .15s,box-shadow .15s}.netop .lesson-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px #17344b15}.netop .lesson-card.mock{border-top-color:#295ba5}.netop .card-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;font-weight:800;font-size:14px}.netop .card-top span:last-child{font-size:11px;background:#e1f2f1;padding:3px 9px;border-radius:6px;color:#07575f}.netop .lesson-card h3{font-size:19px}.netop .lesson-card p,.netop .lesson-card details{font-size:13px;color:var(--muted)}.netop summary{cursor:pointer;font-weight:700}.netop details p{margin-top:12px}.netop .card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:18px;margin-top:auto;font-size:12px}.netop .card-foot strong{font-size:15px}.netop .card-foot .button{padding:9px 13px}.netop .note{padding:22px 26px;background:#e8eff6;border-radius:14px;margin:35px 0;color:#385568;font-size:13px}.netop footer{margin-top:45px;padding:25px 16px;background:var(--navy);color:#bacee0;text-align:center;font-size:12px}.netop footer a{color:#c5edf0}.netop .mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.netop .mode-grid h2{font-size:21px}.netop .mode-grid p{font-size:14px;color:var(--muted)}.netop .mode-grid button{width:100%}.netop .home-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.netop #saveNotice{font-size:12px;color:var(--muted);padding:16px;background:#e7eef5;border-radius:10px}.netop #quiz{padding-top:30px}.netop .toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:18px}.netop #mode{font-weight:800}.netop #timer{font-variant-numeric:tabular-nums;margin-right:auto;background:#dcefeb;padding:8px 12px;border-radius:8px;font-size:16px;white-space:nowrap}.netop .layout{display:grid;grid-template-columns:minmax(0,1fr) 238px;gap:24px;align-items:start}.netop #quiz aside{position:sticky;top:20px;padding:20px}.netop #topic{font-size:12px;letter-spacing:.03em}.netop #stem{font-size:clamp(19px,2.2vw,25px);overflow-wrap:anywhere;white-space:pre-wrap}.netop #options{display:grid;gap:12px;margin:24px 0}.netop #options button{display:block;width:100%;text-align:left;padding:16px 18px;font-weight:500;font-size:16px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}.netop #options .selected{border:2px solid var(--accent);background:#e9f6f5;padding:15px 17px}.netop #options .correct{border:2px solid #237145;background:#eaf7ef;color:#12502d}.netop #options .incorrect{border:2px solid #ae3046;background:#fff0f2;color:#8c1d33}.netop #options button:disabled{opacity:1}.netop #diagram svg{width:100%;height:auto}.netop #explanation{margin-top:25px;border-top:2px solid #b4d6d5;padding:22px;background:#edf7f5;border-radius:0 0 10px 10px;white-space:pre-wrap;overflow-wrap:anywhere}.netop .question-panel label{display:flex;gap:9px;align-items:center;font-size:13px;padding:6px 0}.netop #flag{width:20px;height:20px;accent-color:var(--accent)}.netop .question-panel nav{display:flex;gap:10px;flex-wrap:wrap;justify-content:space-between;margin-top:24px}.netop #grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:16px 0}.netop #grid button{padding:0;min-height:36px;font-size:12px;border-radius:7px}.netop #grid .answered{background:#daf0ed;color:#17594d}.netop #grid .flagged{border:2px solid #b66b0c}.netop #grid .current{background:#087b83;color:#fff}.netop progress{width:100%;height:8px;accent-color:var(--accent)}.netop #count,.netop aside small{font-size:12px;color:var(--muted)}.netop #result{margin-top:36px}.netop #score{font-size:clamp(28px,5vw,46px);color:var(--accent)}.netop #breakdown{overflow-x:auto;margin:24px 0}.netop table{border-collapse:collapse;width:100%;font-size:14px}.netop th,.netop td{padding:12px;text-align:left;border-bottom:1px solid var(--line)}.netop th{background:#eef4f7}.netop .help{font-size:12px;color:var(--muted);margin-top:20px}
@media(max-width:960px){.netop .hero{grid-template-columns:1fr;gap:28px;padding-top:35px}.netop .lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.netop .layout{grid-template-columns:minmax(0,1fr)}.netop #quiz aside{position:static;order:-1}.netop #grid{grid-template-columns:repeat(10,minmax(0,1fr))}.netop #quiz aside h3{margin-bottom:8px}}
@media(max-width:640px){.netop .wrap,.netop main{width:calc(100% - 28px)}.netop .head{flex-wrap:wrap;gap:14px}.netop .brand strong{font-size:14px}.netop .head nav{font-size:12px}.netop .hero{padding-top:28px}.netop .board{padding:22px}.netop .metrics{gap:10px}.netop .metrics strong{font-size:25px}.netop .lesson-grid,.netop .mode-grid{grid-template-columns:1fr}.netop .section-head{align-items:start;flex-direction:column;gap:8px}.netop .lesson-card,.netop .panel,.netop article.question-panel,.netop #result{padding:20px}.netop .toolbar{gap:8px}.netop .toolbar button{font-size:12px;padding:8px 10px}.netop #timer{font-size:14px}.netop #grid{grid-template-columns:repeat(6,minmax(0,1fr))}.netop #grid button{min-height:44px}.netop .question-panel nav button{flex:1 1 auto}.netop .help{display:none}}
@media(prefers-reduced-motion:reduce){.netop *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Direct lesson entry: compact tools, question first on every viewport. */
.netop .lesson-heading{padding:24px 0 0}
.netop .lesson-heading h1{font-size:clamp(20px,2.5vw,28px);margin-bottom:6px}
.netop .lesson-heading p{font-size:13px;color:var(--muted);margin-bottom:10px}
.netop .lesson-tools{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.netop .lesson-tools button{padding:8px 12px;font-size:12px;min-height:44px}
.netop .lesson-help{font-size:12px;color:var(--muted);margin-bottom:14px}
.netop .lesson-help p{margin:8px 0}
.netop .lesson-heading+#quiz{padding-top:4px}
@media(max-width:960px){.netop .lesson-heading+#quiz aside{order:0}.netop .lesson-heading+#quiz #grid button{min-height:44px}}

/* NETOP 즉시 판정: 선택지 위 상태 문구의 정오 색상만 지정. */
.netop #explanation[data-correct="true"]{color:#12502d;background:#eaf7ef;border-color:#237145;font-weight:700}
.netop #explanation[data-correct="false"]{color:#8c1d33;background:#fff0f2;border-color:#ae3046;font-weight:700}