body{font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:#f5f7fa;color:#18202a;line-height:1.58;margin:0}
header{background:#111827;color:#fff;padding:28px 18px}.wrap,main{max-width:1050px;margin:auto}main{padding:20px 18px}
section,.card{background:#fff;border:1px solid #dde3ea;border-radius:14px;padding:20px;margin-bottom:18px}
a{color:#075fb8}.local{color:#08775b}.meta{font-size:12px;color:#657180;background:#f7f9fb;padding:10px;border-radius:8px}
.term{border-top:1px solid #edf1f5;padding:13px 0}.term:first-of-type{border-top:0}.term h3{margin:0 0 5px}
.btn{display:inline-block;border:1px solid #cbd5e1;border-radius:999px;padding:5px 9px;text-decoration:none;font-size:12px;margin:4px 5px 0 0}
.search{position:sticky;top:0;z-index:3;background:#fff;padding:10px 18px;border-bottom:1px solid #ddd}.search input{width:100%;max-width:1050px;margin:auto;display:block;padding:11px;border:1px solid #bbb;border-radius:9px}
.hidden{display:none}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px}.pill{border:1px solid #ddd;background:#fff;padding:9px;border-radius:9px;text-decoration:none}

.online-more{margin-top:18px;padding:14px;border:1px solid #d8e2ee;border-radius:10px;background:#f8fbff}.online-more h2{margin-top:0}.online-more .btn{background:#fff}.source-note{font-size:12px;color:#657180}

.modebar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 18px;padding:10px;border:1px solid #d7e0ea;border-radius:12px;background:#f8fafc}
.btn.online{background:#fff7e8;border:1px solid #f0b54d;color:#7a4600}
.btn.online:hover{background:#ffedc7}
.modehint{font-size:.9rem;color:#53606f;margin-top:-8px;margin-bottom:16px}

.fun-subpage-art{display:block;width:min(100%,760px);max-height:260px;object-fit:cover;border-radius:14px;margin:14px auto 18px;border:1px solid #d7e0ea}
.fun-caption{text-align:center;font-size:.88rem;color:#5b6672;margin:-10px 0 18px}

.concept-icons{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:10px 0 16px}
.concept-icons a{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #d8e2ec;border-radius:9px;background:#fff;text-decoration:none;font-size:.78rem}
.concept-icons img{width:25px;height:25px;object-fit:contain}.concept-icons a:hover{box-shadow:0 2px 8px rgba(30,60,90,.12)}
.deepnext{border-left:4px solid #5680a8;padding:10px 14px;background:#f7fbff;border-radius:8px}

.hidden-cat-card{float:right;width:min(210px,38vw);margin:8px 0 12px 16px;padding:6px;background:#fff;border:1px dashed #b9c5d2;border-radius:11px;box-shadow:0 2px 8px rgba(20,40,60,.08)}
.hidden-cat-card img{display:block;width:100%;height:105px;object-fit:cover;border-radius:7px}.hidden-cat-card p{font-size:.72rem;line-height:1.2;margin:5px 2px 1px;color:#596572}
.hidden-cat-card:hover{transform:rotate(-.5deg);box-shadow:0 4px 13px rgba(20,40,60,.15)}
@media(max-width:600px){.hidden-cat-card{float:none;width:190px;margin:10px auto}.hidden-cat-card img{height:100px}}

.v20-learning{margin:20px 0;padding:16px 18px;border:1px solid #d7e1eb;border-radius:14px;background:linear-gradient(180deg,#ffffff,#f8fbff)}
.v20-learning h2{margin-top:0}.v20-learning h3{margin-top:14px}.v20-learning b{font-weight:800}
.hidden-animal-card{float:right;width:min(205px,38vw);margin:8px 0 12px 16px;padding:6px;background:#fff;border:1px dashed #b7c4d1;border-radius:11px;box-shadow:0 2px 8px rgba(20,40,60,.08)}
.hidden-animal-card img.animal-photo{display:block;width:100%;height:105px;object-fit:cover;border-radius:7px}
.hidden-animal-card .qr{width:62px;height:62px;display:block;margin:6px auto 3px}.hidden-animal-card p{font-size:.72rem;line-height:1.2;margin:4px 2px;color:#596572;text-align:center}
@media(max-width:600px){.hidden-animal-card{float:none;width:190px;margin:10px auto}}

.mcq{margin:12px 0 20px;padding:14px;border:1px solid #dbe3ec;border-radius:13px;background:#fbfdff}
.quiz-options{display:grid;gap:8px;margin-top:10px}
.quiz-option{display:block;width:100%;text-align:left;padding:10px 12px;border:1px solid #cfd9e4;border-radius:9px;background:white;cursor:pointer;font:inherit}
.quiz-option:hover{background:#f2f7fc}.quiz-option:disabled{cursor:default;opacity:1}
.quiz-option.q-correct{border-color:#4f9a64;background:#ecf8ef}.quiz-option.q-wrong{border-color:#c65c5c;background:#fff0f0}
.quiz-feedback{margin-top:10px;font-weight:700}.quiz-hint{font-size:.82rem;color:#5c6875}

.v23-ill{margin:12px 0 18px;padding:8px;border:1px solid #d8e2ec;border-radius:12px;background:#fff;clear:both}
.v23-ill a{display:block;text-decoration:none}.v23-ill img{display:block;width:100%;max-height:220px;object-fit:contain;border-radius:8px}
.v23-ill figcaption{font-size:.78rem;color:#5c6875;margin-top:6px;text-align:center}
.v23-ill.playful img{object-fit:cover;max-height:180px}

.task-data-audit{margin:10px 0 14px;padding:10px 13px;border:1px solid #bfcddd;border-radius:10px;background:#f8fbff}
.task-data-audit h4{margin:0 0 6px}.task-data-audit p{margin:5px 0}.task-data-audit ul{margin:5px 0 8px 20px}
.task-question{font-size:1.03rem;padding:9px 11px;background:#fffdf5;border-left:4px solid #d49b25;border-radius:6px}

.v25-card{margin:14px 0;padding:14px 16px;border:1px solid #d5e0ea;border-radius:13px;background:#fff}
.v25-card h2,.v25-card h3{margin-top:0}.v25-kicker{font-size:.82rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#526474}
.layernav{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 15px}.onlinebox{margin:18px 0;padding:10px 12px;border:1px dashed #c7a45c;border-radius:10px;background:#fffaf0}
.formula-box{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:#f4f7fa;padding:10px 12px;border-radius:9px;border-left:4px solid #526e91}
.exam-box{background:#fffdf2;border:1px solid #e4d59a}.answer-box{background:#f1fbf4;border:1px solid #b9dec4}
.role-note{font-size:.9rem;color:#52606d;background:#f6f8fa;padding:8px 10px;border-radius:8px}
.step-mascot{width:54px;height:54px;object-fit:contain;vertical-align:middle;margin:0 8px 4px 0;border-radius:10px}
.solsec h2{display:flex;align-items:center;gap:6px}
.learning-path-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.learning-path-grid article{padding:13px;border:1px solid #dbe3eb;border-radius:12px;background:white}

.concept-icon-static{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #d8e2ec;border-radius:9px;background:#fff;font-size:.78rem}
.concept-icon-static img{width:25px;height:25px;object-fit:contain}
.content-link{display:block;padding:12px 14px;margin:7px 0;border:1px solid #cbd7e3;border-radius:11px;background:#fff;text-decoration:none;font-weight:750}
.content-link:hover{background:#f3f8fc}
.start-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.start-grid article{background:#fff;border:1px solid #dbe3eb;border-radius:14px;padding:15px}
.start-grid h2{margin-top:0}
.nav-warning{background:#fff7df;border:1px solid #e3c870;border-radius:10px;padding:10px 12px}

:root{--z-side:260px}
body.v27-shell{padding-left:var(--z-side)}
.v27-sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--z-side);overflow:auto;background:#101820;color:#eef6ff;padding:14px 12px;z-index:999;border-right:1px solid #2b3b49}
.v27-sidebar h2{font-size:1rem;margin:12px 0 6px;color:#fff}.v27-sidebar a{display:block;color:#dcecff;text-decoration:none;padding:7px 9px;border-radius:8px;margin:2px 0}
.v27-sidebar a:hover,.v27-sidebar a.current{background:#23445c;color:white}
.v27-sidebar .side-small{font-size:.78rem;color:#9eb6c7;margin:8px 0 12px}
.v27-sidebar img{max-width:100%;border-radius:10px;margin:7px 0}
.v27-sidebar details{border-top:1px solid #2d3d4b;padding-top:6px;margin-top:6px}
.v27-sidebar summary{cursor:pointer;font-weight:800;padding:6px 4px}
.v27-mobile-toggle{display:none;position:fixed;left:8px;top:8px;z-index:1001;background:#132a3b;color:white;border:0;border-radius:9px;padding:9px 11px}
.v27-funny{margin:14px 0;padding:10px;border:1px solid #d8e2ec;border-radius:12px;background:#fff}
.v27-funny img{display:block;max-width:220px;width:100%;margin:auto;border-radius:10px}.v27-funny figcaption{text-align:center;font-size:.8rem;color:#52606d;margin-top:5px}
@media(max-width:900px){
 body.v27-shell{padding-left:0}
 .v27-sidebar{transform:translateX(-105%);transition:transform .2s ease;width:min(84vw,300px)}
 body.v27-nav-open .v27-sidebar{transform:translateX(0)}
 .v27-mobile-toggle{display:block}
}

.v28-deep{margin:20px 0;padding:18px;border:2px solid #b8c9d9;border-radius:16px;background:#fbfdff}
.v28-deep h2{margin-top:22px;border-bottom:1px solid #dbe5ee;padding-bottom:6px}.v28-deep h3{margin-top:16px}
.v28-vocab{display:flex;flex-wrap:wrap;gap:7px}.v28-vocab a{padding:6px 9px;border:1px solid #bfd0df;border-radius:999px;background:#eef6fc;text-decoration:none}
.v28-callout{padding:12px 14px;border-left:5px solid #5c7fa3;background:#f1f6fb;border-radius:8px;margin:12px 0}
.v28-danger{padding:12px 14px;border-left:5px solid #b85645;background:#fff4f1;border-radius:8px;margin:12px 0}
.v28-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.v28-grid>div{border:1px solid #d9e3ec;border-radius:10px;padding:12px;background:white}
.v28-gloss-list{list-style:none;padding:0}.v28-gloss-list li{margin:10px 0;padding:10px;border-bottom:1px solid #dde5ec}.v28-gloss-list span{display:block;margin:5px 10px;color:#52606d}

.v30-definition{padding:16px 18px;margin:12px 0 22px;border:2px solid #9fb9cf;border-radius:14px;background:#f7fbff;line-height:1.65}
.v30-definition p{margin:0 0 12px}.v30-definition p:last-child{margin-bottom:0}
