.mc-java-reader { padding: 4rem 0; background: #f5f7f2; color: #192a22; }
.mc-java-reading-layout { display: grid; grid-template-columns: 200px minmax(0, 1fr); align-items: start; gap: 3rem; }
.mc-java-toc { position: sticky; top: 7rem; display: grid; gap: .35rem; padding: 1.25rem; border: 1px solid #d7e1d6; border-radius: 10px; background: #fff; }
.mc-java-toc .mc-course-kicker, .mc-java-article .mc-course-kicker { color: #296234; }
.mc-java-toc a { padding: .5rem 0; color: #31503c; font-size: .88rem; line-height: 1.6; }
.mc-java-toc a:hover, .mc-java-article a { color: #205d2d; text-decoration: underline; text-underline-offset: .2em; }
.mc-java-article { min-width: 0; max-width: 870px; font-size: 1rem; line-height: 1.9; overflow-wrap: anywhere; }
.mc-java-article h2 { font-size: clamp(1.8rem, 4vw, 2.7rem); line-height: 1.3; margin-bottom: 1rem; }
.mc-java-article h3 { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.4; margin-bottom: 1rem; }
.mc-java-article h4 { font-size: 1.2rem; margin-bottom: .6rem; }
.mc-java-article section { padding-top: 2.8rem; margin-top: 2rem; border-top: 1px solid #d4dfd2; scroll-margin-top: 7rem; }
.mc-java-step { display: inline-block; margin-bottom: .7rem; color: #35663c; font-size: .8rem; font-weight: 800; letter-spacing: .08em; }
.mc-java-article figure { margin: 1.6rem 0; }
.mc-java-article img { width: 100%; height: auto; display: block; border-radius: 10px; border: 1px solid #dae2d6; }
.mc-java-article figcaption { margin-top: .5rem; color: #536354; font-size: .82rem; line-height: 1.6; }
.mc-java-article code, .mc-java-teacher code { font-family: Consolas, "Courier New", monospace; font-size: .9em; }
.mc-java-article p code, .mc-java-article li code, .mc-java-article td code, .mc-java-article dd code { background: #e6ece3; padding: .1em .25em; border-radius: 3px; }
.mc-java-code { margin: 1.3rem 0; overflow: hidden; background: #10221d; border: 1px solid #284737; border-radius: 9px; color: #eef8ef; }
.mc-java-code > p { margin: 0; padding: .65rem 1rem; color: #cdf2a9; background: #1a3329; font-size: .8rem; line-height: 1.5; }
.mc-java-code pre { margin: 0; padding: 1.2rem; overflow-x: auto; max-width: 100%; font-size: .88rem; line-height: 1.8; tab-size: 4; white-space: pre; overflow-wrap: normal; }
.mc-java-code pre code { font-size: inherit; }
.mc-java-code pre:focus-visible, .mc-java-table-wrap:focus-visible { outline: 3px solid #73c647; outline-offset: -3px; }
.mc-java-definitions { margin: 1.4rem 0; }
.mc-java-definitions > div { margin: .8rem 0; padding-left: 1rem; border-left: 3px solid #6c9e52; }
.mc-java-definitions dt { font-weight: 800; font-size: .95rem; }
.mc-java-definitions dd { margin: .25rem 0 0; color: #425746; }
.mc-java-note { margin: 1.4rem 0; padding: 1.2rem 1.4rem; border: 1px solid #b8d4a6; border-left: 4px solid #5a923c; border-radius: 6px; background: #eaf3e4; }
.mc-java-note p { margin: .5rem 0 0; }
.mc-java-note.is-warning { background: #fff4d9; border-color: #e0c371; }
.mc-java-table-wrap { overflow-x: auto; margin: 1.4rem 0; border: 1px solid #cbd8c7; border-radius: 8px; }
.mc-java-article table, .mc-java-teacher table { width: 100%; border-collapse: collapse; text-align: left; font-size: .88rem; line-height: 1.7; }
.mc-java-article th, .mc-java-article td, .mc-java-teacher th, .mc-java-teacher td { padding: .85rem; vertical-align: top; border-bottom: 1px solid #d9e3d5; }
.mc-java-article thead { background: #e3ecde; }
.mc-java-article tbody tr:last-child th, .mc-java-article tbody tr:last-child td { border-bottom: 0; }
.mc-java-article li { margin-bottom: .7rem; }
.mc-java-detail { margin: 1.3rem 0; border: 1px solid #cbd8c7; border-radius: 8px; background: #fff; }
.mc-java-detail summary { cursor: pointer; padding: 1rem; font-weight: 750; line-height: 1.6; }
.mc-java-detail > div { padding: .2rem 1.2rem 1rem; }
.mc-java-detail > div > :last-child { margin-bottom: 0; }
.mc-java-source { margin-top: 2rem; font-size: .82rem; color: #5a6959; }
.mc-java-teacher { padding: 3.5rem 0; border-top: 1px solid var(--mc-border); background: #101e19; }
.mc-java-teacher h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: .8rem; }
.mc-java-teacher-intro { color: #c4d7c8; line-height: 1.8; max-width: 55rem; }
.mc-java-teacher .mc-java-detail { background: #18291f; border-color: #395040; color: #f0f7ed; }
.mc-java-teacher .mc-java-detail > div { max-width: 950px; line-height: 1.85; overflow-wrap: anywhere; }
.mc-java-teacher h3 { font-size: 1.5rem; margin: .5rem 0 1rem; }
.mc-java-teacher h4 { margin: 2rem 0 .6rem; color: #d0ecb2; font-size: 1.12rem; }
.mc-java-teacher li { margin-bottom: .65rem; }
.mc-java-teacher dl dt { font-weight: 750; margin-top: .9rem; color: #e0eccf; }
.mc-java-teacher dl dd { margin: .35rem 0 1rem; color: #c4d7c8; }
.mc-java-teacher .mc-java-table-wrap { border-color: #395040; }
.mc-java-teacher th, .mc-java-teacher td { border-color: #395040; }
.mc-java-teacher thead { background: #243c2d; }
.mc-java-teacher .mc-java-code { max-width: 100%; }
.mc-java-teacher summary:focus-visible, .mc-java-detail summary:focus-visible, .mc-java-toc a:focus-visible { outline: 3px solid #73c647; outline-offset: 3px; }
#lesson-reading, #teacher-notes { scroll-margin-top: 7rem; }
@media (max-width: 900px) {
    .mc-java-reading-layout { grid-template-columns: 1fr; gap: 2rem; }
    .mc-java-toc { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem 1rem; }
    .mc-java-toc .mc-course-kicker { grid-column: 1 / -1; margin-bottom: .2rem; }
}
@media (max-width: 620px) {
    .mc-java-reader { padding: 2.3rem 0; }
    .mc-java-article { font-size: .95rem; }
    .mc-java-code pre { font-size: .78rem; padding: .85rem; }
    .mc-java-note { padding: 1rem; }
    .mc-java-article th, .mc-java-article td { padding: .65rem; min-width: 105px; }
    .mc-java-teacher .mc-java-detail > div { padding-inline: .8rem; }
}
