/* ============================================================
   AICL — aicl.css(디자인 시스템) 위에 얹는 애플리케이션 스타일.
   색은 전부 aicl.css 의 CSS 변수를 쓴다. 여기에 색을 직접 박지 말 것.
   ============================================================ */

html, body { height: 100%; }
body { display: flex; flex-direction: column; min-height: 100vh; background: var(--lab-page); }
main { flex: 1 0 auto; }
.aicl-foot { flex-shrink: 0; }

/* ── 네비게이션 드롭다운 ───────────────────────────────────── */
.aicl-drop { position: relative; }
.aicl-drop-menu {
    display: none; position: absolute; left: 0; top: 100%; z-index: 1040;
    min-width: 210px; padding: .4rem 0;
    background: var(--lab-surface); border: 1px solid var(--lab-border); border-radius: 12px;
    box-shadow: 0 .9rem 2rem rgba(0, 0, 0, .38);
}
.aicl-drop:hover .aicl-drop-menu, .aicl-drop:focus-within .aicl-drop-menu { display: block; }
.aicl-drop-menu a {
    display: block; padding: .5rem 1rem; font-size: .86rem;
    color: var(--lab-text-soft); text-decoration: none; white-space: nowrap;
}
.aicl-drop-menu a:hover { background: var(--lab-accent-soft); color: var(--lab-accent); }

.navbar.aicl-nav .nav-link.admin { color: #ffb3b3 !important; }
.navbar.aicl-nav .navbar-nav { gap: .1rem; }

/* 모바일 — 접힌 메뉴가 펼쳐질 때 배경을 깔아 준다(네비가 반투명이라) */
@media (max-width: 991.98px) {
    .navbar.aicl-nav .navbar-collapse {
        background: rgba(11, 21, 35, .97); margin: 0 -1rem; padding: .6rem 1rem 1rem;
        border-bottom: 1px solid var(--lab-border);
        max-height: calc(100vh - var(--aicl-nav-h)); overflow-y: auto;
    }
    .navbar.aicl-nav .nav-link { padding: .55rem .9rem !important; }
    .aicl-drop-menu {
        display: block; position: static; border: 0; box-shadow: none;
        background: transparent; padding: 0 0 .35rem .9rem;
    }
    .aicl-drop-menu a { color: var(--lab-on-dark-muted); padding: .3rem 0; font-size: .84rem; }
    .aicl-drop-menu a:hover { background: transparent; color: var(--lab-on-dark-accent); }
}

/* ── 로고 ─────────────────────────────────────────────────── */
.aicl-mark { display: block; height: 30px; width: 40px; flex: none; filter: drop-shadow(0 0 6px rgba(79, 195, 247, .45)); }
.aicl-wordmark { display: block; width: 78px; height: auto; }
.aicl-brand-stack { display: flex; flex-direction: column; line-height: 1; }

/* 로고 안의 움직임 — index.html 의 것을 그대로 가져왔다 */
.mk-sat { transform-origin: 60px 60px; animation: mkspin 7s linear infinite; }
@keyframes mkspin { to { transform: rotate(360deg); } }
.mk-w { stroke-dasharray: 170; animation: mkwave 3.4s ease-in-out infinite; }
@keyframes mkwave {
    0%   { stroke-dashoffset: 170; opacity: .15; }
    40%  { stroke-dashoffset: 0; opacity: 1; }
    72%  { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: -170; opacity: .15; }
}
.wm-wave { animation: wmwave 2.6s ease-in-out infinite; }
@keyframes wmwave { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.wm-sig { transform-origin: 222px 66px; animation: wmsig 2.6s ease-in-out infinite; }
@keyframes wmsig { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .55; transform: scale(.9); } }
.wm-apex { transform-origin: 140px 1px; animation: wmapex 2.4s ease-out infinite; }
@keyframes wmapex { 0% { transform: scale(.6); opacity: .8; } 100% { transform: scale(1.7); opacity: 0; } }
.wm-pk { animation: wmpk 2.2s linear infinite; }
@keyframes wmpk {
    0%   { transform: translateX(-10px); opacity: 0; }
    25%  { opacity: 1; }
    80%  { opacity: 1; }
    100% { transform: translateX(22px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .mk-sat, .mk-w, .wm-wave, .wm-sig, .wm-apex, .wm-pk { animation: none; }
}

/* ── 로그인 표시 ───────────────────────────────────────────── */
.aicl-auth { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; font-size: .82rem; }
.aicl-auth a, .aicl-auth button {
    color: var(--lab-on-dark-muted); background: none; border: 0; padding: 0;
    text-decoration: none; font-size: .82rem;
}
.aicl-auth a:hover, .aicl-auth button:hover { color: var(--lab-on-dark-accent); text-decoration: underline; }
.aicl-auth .sep { color: var(--lab-on-dark-dim); }
.aicl-auth form { display: inline; }

/* ── 미준비 자료 플레이스홀더 ──────────────────────────────── */
.lab-todo {
    display: inline-block; margin-top: .6rem;
    background: rgba(248, 113, 113, .1); color: #fca5a5; border: 1px dashed rgba(248, 113, 113, .38);
    border-radius: 6px; padding: .25rem .6rem; font-size: .74rem; font-weight: 600;
}
:root[data-theme="light"] .lab-todo { background: #FFF1F2; color: #B42318; border-color: #F2B8B5; }
.lab-ph {
    display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .35rem;
    background: var(--lab-accent-soft); border: 1px dashed var(--lab-accent-border);
    border-radius: 10px; color: var(--lab-muted); font-size: .78rem; text-align: center; padding: 1rem;
}
.lab-ph .lab-todo { margin-top: 0; }

/* ── 홈 히어로 ────────────────────────────────────────────── */
.aicl-hero-wordmark {
    width: clamp(210px, 46vw, 460px); margin: 0 auto .8rem; display: block;
    filter: drop-shadow(0 0 26px rgba(79, 195, 247, .38));
}
.aicl-hero-rule { width: 60px; height: 2px; background: var(--lab-accent); margin: 1.3rem auto; opacity: .7; }
.aicl-scroll-cue {
    position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 2;
    color: var(--lab-on-dark-dim); font-size: .66rem; letter-spacing: .2em;
    animation: aiclBob 2.4s ease-in-out infinite;
}
@keyframes aiclBob {
    0%, 100% { transform: translate(-50%, 0); opacity: .45; }
    50%      { transform: translate(-50%, 7px); opacity: .9; }
}
@media (prefers-reduced-motion: reduce) { .aicl-scroll-cue { animation: none; } }

/* index.html 의 .wrap / .eyebrow / h2.sec / .lede 를 그대로 옮겼다 */
.aicl-wrap {
    max-width: 1120px; margin: 0 auto;
    padding: clamp(48px, 7vw, 80px) clamp(20px, 5vw, 40px);
}
.aicl-eyebrow {
    color: var(--lab-accent); font-size: .72rem; letter-spacing: .28em;
    text-transform: uppercase; margin: 0 0 10px; font-weight: 400;
}
.aicl-sec {
    font-size: clamp(1.6rem, 4.6vw, 2.4rem); margin: 0 0 12px;
    font-weight: 600; letter-spacing: -.01em; color: var(--lab-ink); line-height: 1.3;
}
.aicl-lede {
    color: var(--lab-muted); max-width: 62ch; margin: 0 0 44px; word-break: keep-all;
}
.aicl-lede b { color: inherit; font-weight: 700; }

/* 로고 소개 블록 */
.aicl-logo-block {
    display: flex; align-items: center; justify-content: center;
    gap: clamp(20px, 5vw, 60px); flex-wrap: wrap;
    margin-top: 8px; padding: 40px 28px;
    background: var(--lab-card-bg); border: 1px solid var(--lab-border);
    border-radius: 20px; position: relative; overflow: hidden;
}
.aicl-logo-block::before {
    content: ""; position: absolute; inset: -40%; pointer-events: none;
    background: radial-gradient(circle at 50% 50%, rgba(79, 195, 247, .10), transparent 55%);
}
.aicl-logo-block .logo-mark {
    width: clamp(170px, 30vw, 250px); height: auto; position: relative;
    filter: drop-shadow(0 0 18px rgba(79, 195, 247, .28));
}
.aicl-logo-block .logo-word { position: relative; text-align: left; }
.aicl-logo-block .logo-word .aicl-wordmark {
    width: clamp(180px, 30vw, 300px);
    filter: drop-shadow(0 0 18px rgba(79, 195, 247, .32));
}
.aicl-logo-block .logo-word span {
    display: block; margin-top: .7rem; font-size: clamp(.7rem, 1.6vw, .92rem);
    letter-spacing: .3em; color: var(--lab-text-soft); text-transform: uppercase; font-weight: 300;
}
.aicl-logo-block .logo-word em {
    display: block; margin-top: .9rem; font-style: normal; font-size: .82rem;
    color: var(--lab-muted2); word-break: keep-all;
}
@media (max-width: 720px) {
    .aicl-logo-block { padding: 1.9rem 1.1rem; }
    .aicl-logo-block .logo-word { text-align: center; }
    .aicl-logo-block .logo-word .aicl-wordmark { margin: 0 auto; }
}

/* ── 연구분야 카드 ────────────────────────────────────────── */
.lab-area-title { font-size: 1.1rem; font-weight: 600; color: var(--lab-ink); margin: 0; }
.lab-area-ko {
    font-size: .72rem; letter-spacing: .1em; color: var(--lab-accent-dim);
    text-transform: uppercase; margin: .2rem 0 .7rem;
}
.lab-area-desc { font-size: .88rem; line-height: 1.7; color: var(--lab-muted); margin: 0 0 .9rem; word-break: keep-all; }
.lab-area-no { font-size: .78rem; font-weight: 700; color: var(--lab-accent); letter-spacing: .06em; }
.aicl-area-heading { font-size: 1.28rem; font-weight: 600; color: var(--lab-ink); }

/* 네 장의 원본 비율이 제각각이라, 4:3 으로 잘라 높이를 맞춘다. */
.lab-area-fig { width: 130px; flex: 0 0 130px; }
.lab-area-fig img,
.lab-area-fig .lab-ph {
    width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
    border-radius: 10px; border: 1px solid var(--lab-border); display: block;
}
.lab-area-fig .lab-ph { border-style: dashed; border-color: var(--lab-accent-border); }

/* ── 논문 목록 ────────────────────────────────────────────── */
.lab-count {
    font-size: .72rem; font-weight: 600; color: var(--lab-muted2);
    background: transparent; border: 1px solid var(--lab-border);
    border-radius: 999px; padding: .1rem .55rem; flex: 0 0 auto;
}
.lab-pub-status { font-weight: 600; color: var(--lab-accent-bright); }

/* 논문 한 건 전체가 링크다. 제목을 누르면 상세로 간다. */
.lab-pub-link { display: block; color: inherit; text-decoration: none; }
.lab-pub-link:hover { color: inherit; text-decoration: none; }
.lab-pub-link:hover .lab-pub-title { color: var(--lab-accent); }
.lab-pub-title { transition: color .18s ease; }

/* ── 구성원 ───────────────────────────────────────────────── */
.aicl-prof-photo {
    width: 100%; aspect-ratio: 3 / 4; object-fit: cover;
    border-radius: 14px; border: 1px solid var(--lab-border); background: var(--lab-bg-soft);
}
.aicl-prof-name { display: flex; align-items: baseline; flex-wrap: wrap; gap: .55rem; }
.aicl-prof-name .ko { font-size: 1.6rem; font-weight: 700; color: var(--lab-ink); letter-spacing: -.01em; }
.aicl-prof-name .en { font-size: .82rem; font-weight: 500; color: var(--lab-accent); letter-spacing: .14em; text-transform: uppercase; }
.aicl-prof-title-ko { margin: .55rem 0 .15rem; font-size: .95rem; color: var(--lab-ink); }
.aicl-prof-title-en { margin: 0; font-size: .86rem; line-height: 1.6; color: var(--lab-muted); }

.aicl-edu { margin: 0; padding-left: 1.1rem; line-height: 1.9; font-size: .9rem; color: var(--lab-text-soft); }

.aicl-subcareer { list-style: none; margin: .6rem 0 0; padding: 0; }
.aicl-subcareer li { display: flex; gap: .8rem; padding: .22rem 0; font-size: .83rem; }
.aicl-subcareer .k { flex: 0 0 108px; color: var(--lab-accent-dim); font-weight: 600; }
.aicl-subcareer .v { flex: 1 1 auto; color: var(--lab-muted); }
@media (max-width: 480px) { .aicl-subcareer li { flex-direction: column; gap: 0; } }

.aicl-student-card { text-align: center; height: 100%; }
.aicl-student-photo {
    width: 92px; height: 92px; border-radius: 50%; object-fit: cover;
    margin: 0 auto .7rem; display: block;
    background: var(--lab-bg-soft); border: 1px solid var(--lab-border);
}
.aicl-student-name { font-weight: 600; color: var(--lab-ink); font-size: .95rem; }
.aicl-student-meta { font-size: .78rem; color: var(--lab-muted2); }

/* ── 표 · 게시판 ──────────────────────────────────────────── */
.lab-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.lab-table th {
    text-align: left; font-size: .72rem; font-weight: 700; color: var(--lab-accent);
    text-transform: uppercase; letter-spacing: .12em;
    border-bottom: 1px solid var(--lab-border); padding: .7rem .6rem;
}
.lab-table td { border-bottom: 1px solid var(--lab-border); padding: .8rem .6rem; vertical-align: middle; color: var(--lab-text-soft); }
.lab-table tbody tr:hover td { background: var(--lab-surface2); }
.lab-table .num { width: 64px; color: var(--lab-muted2); font-size: .8rem; }
.lab-table .meta { width: 130px; color: var(--lab-muted2); font-size: .8rem; white-space: nowrap; }
.lab-table-wrap { overflow-x: auto; }
.lab-post-body { line-height: 1.8; white-space: pre-wrap; word-break: break-word; color: var(--lab-text-soft); }

/* ── 저장소 카드 ──────────────────────────────────────────── */
.aicl-repo-link { text-decoration: none; color: inherit; display: block; height: 100%; }
.aicl-repo-link:hover { text-decoration: none; color: inherit; }
.lab-code {
    background: var(--lab-bg-soft); border: 1px solid var(--lab-border); border-radius: 8px;
    padding: .8rem 1rem; font-size: .82rem; overflow-x: auto; margin: 0 0 .8rem; color: var(--lab-text-soft);
}
.lab-code code { color: var(--lab-accent-bright); }

/* ── 지도 ─────────────────────────────────────────────────── */
/* 카드 안쪽을 지도가 통째로 채운다. 왼쪽 연락처 카드와 높이를 맞춘다. */
.aicl-map-card { display: flex; overflow: hidden; min-height: 360px; }
.aicl-map {
    display: block; flex: 1 1 auto; width: 100%; min-height: 360px; height: 100%;
    border: 0; background: var(--lab-bg-soft);
    filter: brightness(.86) contrast(1.06);
}
:root[data-theme="light"] .aicl-map { filter: none; }
@media (max-width: 991.98px) {
    .aicl-map-card, .aicl-map { min-height: 300px; }
}

/* ── 폼 · 버튼 (부트스트랩 위에) ──────────────────────────── */
.form-control, .form-select, textarea.form-control {
    background: var(--lab-bg-soft); border-color: var(--lab-border); color: var(--lab-ink);
    border-radius: 10px;
}
.form-control::placeholder { color: var(--lab-muted2); }
.form-control:focus, .form-select:focus {
    background: var(--lab-bg-soft); color: var(--lab-ink);
    border-color: var(--lab-accent); box-shadow: 0 0 0 .2rem rgba(79, 195, 247, .18);
}
.form-check-input { background-color: var(--lab-bg-soft); border-color: var(--lab-border); }
.form-check-input:checked { background-color: var(--lab-accent); border-color: var(--lab-accent); }
.form-label, .form-check-label { color: var(--lab-text-soft); }

/* a.btn-* 까지 적는 이유: `.lab a`(0,1,1)가 `.btn-aicl`(0,1,0)을 이겨
   링크형 버튼의 글자색이 배경색과 같아지는 일이 있었다. */
.btn-aicl, a.btn-aicl {
    background: var(--lab-accent); border-color: var(--lab-accent);
    color: var(--lab-on-accent); font-weight: 600; border-radius: 20px;
}
.btn-aicl:hover, a.btn-aicl:hover {
    background: var(--lab-accent-bright); border-color: var(--lab-accent-bright);
    color: var(--lab-on-accent); text-decoration: none;
}
.btn-outline-aicl, a.btn-outline-aicl { border-color: var(--lab-accent-border); color: var(--lab-accent); border-radius: 20px; }
.btn-outline-aicl:hover, a.btn-outline-aicl:hover { background: var(--lab-accent); color: var(--lab-on-accent); text-decoration: none; }
.btn-outline-secondary, a.btn-outline-secondary { color: var(--lab-muted); border-color: var(--lab-border); border-radius: 20px; }
.btn-outline-secondary:hover, a.btn-outline-secondary:hover { background: var(--lab-surface2); color: var(--lab-ink); border-color: var(--lab-border); text-decoration: none; }
.text-muted { color: var(--lab-muted) !important; }

.modal-content { background: var(--lab-surface); color: var(--lab-ink); border: 1px solid var(--lab-border); border-radius: 16px; }
.modal-header, .modal-footer { border-color: var(--lab-border); }
.btn-close { filter: invert(1) grayscale(1) brightness(1.8); }
:root[data-theme="light"] .btn-close { filter: none; }

/* ── Blazor 오류 배너 ─────────────────────────────────────── */
#blazor-error-ui {
    background: #4A3A12; color: #F5E3B8; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, .3);
    display: none; left: 0; padding: .6rem 1.25rem .7rem; position: fixed; width: 100%; z-index: 1080;
}
#blazor-error-ui a { color: #FFDD8A; text-decoration: underline; font-weight: 600; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }
:root[data-theme="light"] #blazor-error-ui { background: #FFF3CD; color: #6A4A02; }
:root[data-theme="light"] #blazor-error-ui a { color: #6A4A02; }

/* ── 로그인 · 회원가입 · 계정관리 화면 ────────────────────── */
.aicl-auth-page { max-width: 460px; margin: 0 auto; }
.aicl-auth-links {
    margin-top: 1.1rem; text-align: center; font-size: .84rem; color: var(--lab-muted);
}
.aicl-auth-links .sep { color: var(--lab-muted); margin: 0 .35rem; }  /* 테두리색(--lab-border)은 글자로 쓰기엔 너무 옅다 */

/* 입력 검증 메시지 */
.aicl-form-error { display: block; margin-top: .3rem; font-size: .8rem; color: #C0392B; }
.aicl-form-error ul { margin: 0; padding-left: 1.1rem; }
.aicl-form-error:empty { display: none; }
.form-control.input-validation-error { border-color: #C0392B; }

/* 처리 결과 알림 */
.aicl-status {
    margin-bottom: 1rem; padding: .7rem 1rem; border-radius: 10px;
    font-size: .86rem; border: 1px solid transparent;
}
.aicl-status.ok { background: var(--lab-accent-soft); border-color: var(--lab-accent-border); color: var(--lab-accent); }
.aicl-status.err { background: #FDECEA; border-color: #F5C6C2; color: #B42318; }

/* ── Teaching · 전기전자실험 II 실습 실행기 ─────────────────────────
   Pages/Teaching/Eee2Labs.razor · Eee2Lab.razor · wwwroot/js/labrunner.js · wwwroot/lab/webtk.py
   .lab-* 는 페이지 틀, .wt-* 는 webtk.py 가 tkinter 위젯을 HTML 로 옮길 때 붙이는 클래스다. */
.lab-week-summary { font-size: .84rem; margin: .35rem 0 .8rem; }
.lab-week-actions { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.lab-runner-head { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; align-items: flex-start; justify-content: space-between; margin-bottom: .9rem; }
.lab-runner-file { font-size: .82rem; }
.lab-status { margin: .25rem 0 .75rem; padding: .55rem .9rem; border-radius: 10px; font-size: .86rem;
    background: var(--lab-surface2); border: 1px solid var(--lab-border); color: var(--lab-muted); }
.lab-status.busy::before { content: ''; display: inline-block; width: .8em; height: .8em; margin-right: .5em; vertical-align: -.1em;
    border: 2px solid var(--lab-accent); border-right-color: transparent; border-radius: 50%; animation: lab-spin .8s linear infinite; }
.lab-status.err { background: #FDECEA; border-color: #F5C6C2; color: #B42318; }
@keyframes lab-spin { to { transform: rotate(360deg); } }
.lab-runner-frame { background: #F4F6F9; border: 1px solid var(--lab-border); border-radius: 14px; padding: .6rem .8rem 1rem; overflow-x: auto; color: #1a2330; }
.wt-window-title { font-weight: 600; font-size: .95rem; color: #2b3a4d; padding: .15rem .25rem .55rem; }
.wt-window-title:empty { display: none; }
.lab-console { margin-top: .7rem; padding: .6rem .9rem; border-radius: 10px; background: #0f1b2d; color: #d6e4f0;
    font: .8rem/1.55 ui-monospace, Menlo, Consolas, monospace; white-space: pre-wrap; max-height: 260px; overflow: auto; }
.lab-con-line.err { color: #ffb4a8; }
.lab-con-line.out { color: #cfe3f0; }
.lab-code-card { margin-top: 1rem; }
.lab-code-src { max-height: 70vh; overflow: auto; font-size: .78rem; line-height: 1.55; }

/* ── webtk: tkinter 위젯 → HTML ─────────────────────────── */
.webtk-root { font-size: 13.5px; line-height: 1.35; }
.webtk-root * { box-sizing: border-box; }
.wt-root { display: flex; flex-direction: column; min-width: 0; }
.wt-pack { display: flex; min-width: 0; }
.wt-pack-row { flex-direction: row; align-items: center; }
.wt-pack-column { flex-direction: column; align-items: center; }
.wt-grid { display: grid; grid-auto-columns: auto; gap: 0; align-items: center; }
.wt-frame, .wt-toplevel { min-width: 0; }
.wt-relief { border: 1px solid #c9d2dd; border-radius: 6px; padding: 4px; }
.wt-labelframe { border: 1px solid #c3cdd8; border-radius: 8px; padding: 2px 8px 8px; margin: 0; min-width: 0; background: #fff; }
.wt-labelframe > legend { font-size: .82em; font-weight: 600; color: #3b4d63; padding: 0 .35em; width: auto; margin: 0; float: none; }
.wt-lf-body { min-width: 0; }
.wt-label { white-space: pre-wrap; word-break: keep-all; overflow-wrap: normal; color: #1a2330; }
.wt-btn { font: inherit; font-size: .92em; padding: .3em .9em; border: 1px solid #b9c5d3; border-radius: 7px; background: #fff; color: #1a2330; cursor: pointer; }
.wt-btn:hover { background: #eef3f8; }
.wt-btn:active { background: #dfe8f1; }
.wt-btn.wt-disabled, .wt-disabled input { opacity: .5; pointer-events: none; }
.wt-scale { display: flex; align-items: center; gap: .4em; min-width: 150px; }
.wt-range { flex: 1 1 auto; min-width: 120px; accent-color: #2b8db8; margin: 0; }
.wt-scale.wt-vertical { flex-direction: column; }
.wt-scale.wt-vertical .wt-range { writing-mode: vertical-lr; direction: rtl; height: 100%; width: auto; }
.wt-scale-value { font-size: .85em; min-width: 3em; text-align: right; color: #3b4d63; }
.wt-scale-label { font-size: .85em; color: #3b4d63; }
.wt-select, .wt-input { font: inherit; font-size: .92em; padding: .25em .5em; border: 1px solid #b9c5d3; border-radius: 6px; background: #fff; color: #1a2330; }
.wt-select:focus, .wt-input:focus { outline: 2px solid rgba(43,141,184,.35); }
.wt-radio, .wt-check { display: inline-flex; align-items: center; gap: .4em; cursor: pointer; user-select: none; word-break: keep-all; }
.wt-radio input, .wt-check input { margin: 0; accent-color: #2b8db8; }
.wt-notebook { display: flex; flex-direction: column; width: 100%; min-width: 0; }
.wt-tabs { display: flex; flex-wrap: wrap; gap: 2px; border-bottom: 1px solid #c3cdd8; }
.wt-tab { font: inherit; font-size: .9em; padding: .45em 1em; border: 1px solid transparent; border-bottom: 0; border-radius: 8px 8px 0 0;
    background: transparent; color: #4a5d73; cursor: pointer; }
.wt-tab:hover { background: #e9eff5; }
.wt-tab.active { background: #fff; color: #0b1523; border-color: #c3cdd8; font-weight: 600; position: relative; top: 1px; }
.wt-panes { background: #fff; border: 1px solid #c3cdd8; border-top: 0; border-radius: 0 0 10px 10px; padding: 6px; min-width: 0; }
.wt-pane { align-items: flex-start; }
.wt-figure { min-width: 0; text-align: center; }
.wt-mpl { display: inline-block; max-width: 100%; height: auto !important; border: 1px solid #e3e9f0; background: #fff; }
.wt-canvas { display: inline-block; }
.wt-canvas svg { display: block; }
.wt-tree { border-collapse: collapse; font-size: .9em; background: #fff; }
.wt-tree th, .wt-tree td { border: 1px solid #d6dee7; padding: .2em .5em; text-align: center; }
.wt-tree th { background: #eef3f8; font-weight: 600; }
.wt-text { font: inherit; font-size: .9em; border: 1px solid #b9c5d3; border-radius: 6px; }
.wt-sep { width: 100%; border: 0; border-top: 1px solid #d6dee7; margin: .4em 0; }
@media (max-width: 900px) {
    /* 좁은 화면: 왼쪽 조작 패널과 그림을 위아래로 */
    .wt-pane.wt-pack-row, .wt-root > .wt-pack-row { flex-direction: column; align-items: stretch; }
    .wt-pane.wt-pack-row > *, .wt-root > .wt-pack-row > * { margin-left: 0 !important; margin-right: 0 !important; order: 0 !important; }
}

/* 접속 코드 잠금 */
.lab-gate { display: flex; gap: 1rem; align-items: flex-start; max-width: 560px; }
.lab-gate-icon { font-size: 1.6rem; line-height: 1.2; }
.lab-gate-body { flex: 1 1 auto; min-width: 0; }
.lab-gate-form { display: flex; gap: .5rem; margin-top: .8rem; }
.lab-gate-form .form-control { max-width: 190px; letter-spacing: .3em; text-align: center; }

/* 주차 안의 파일 묶음 (강의자료 PDF · 실습 코드) */
.lab-files { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-bottom: .8rem; }
.lab-files-label { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--lab-muted); margin-right: .2rem; }
.lab-week-meta { display: flex; flex-wrap: wrap; gap: .1rem .8rem; font-size: .78rem; color: var(--lab-muted); margin: .3rem 0 .7rem; }
.lab-week-meta span + span::before { content: '·'; margin-right: .8rem; }

/* webmpl: plt.show() 로 띄운 그림 하나 */
.wm-figure { min-width: 0; text-align: center; margin-bottom: .5rem; }
.wm-figure .wt-mpl { touch-action: none; cursor: default; }