/* ================================================================
   2일차 장면: 차시 열기 · 닫기(다리) · 지난주 연결 · 기준값 · 설계서
   ================================================================ */
/* 표지: 손이 센서를 가리면 밤이 된다 */
.s-hero .hero-bg{transition:background-color .6s}
.s-hero:has(.circuit.night) .hero-bg{background-color:rgba(27,40,90,.10)}
.dark-circuit .sky image{transition:opacity .6s}
.dark-circuit .moon,.dark-circuit.night .sun{opacity:0}
.dark-circuit.night .moon{opacity:1}
.dark-circuit .hand{transition:opacity .2s}
.dark-circuit .meter rect,.dark-circuit .rule rect{fill:#fff;stroke:var(--ink);stroke-width:3}
.dark-circuit .mv{font-size:58px;font-weight:900;text-anchor:middle;fill:var(--ink);font-variant-numeric:tabular-nums}
.dark-circuit .mu{font-size:26px;font-weight:700;text-anchor:middle;fill:var(--mute);font-family:var(--hand,var(--ff))}
.dark-circuit .rule text{font-size:32px;font-weight:900;text-anchor:middle;fill:var(--ink)}
.dark-circuit .rule rect{transition:fill .25s,stroke .25s}
.dark-circuit.rule-on .rule rect{fill:var(--hl,#FFD43B);stroke:var(--purple)}
.dark-circuit .rv{fill:var(--coral);font-variant-numeric:tabular-nums}
.dark-circuit .state{font-size:44px;font-weight:900;text-anchor:middle;fill:var(--mute);font-family:var(--hand,var(--ff))}
.dark-circuit.out-on .state{fill:var(--purple)}

/* 차시 여는 장: 앞에서 한 것 → 이번 차시 */
.xo{display:grid;grid-template-columns:1fr auto 1fr;gap:1em;align-items:stretch;margin-top:1.3em}
.xo > div{border-radius:.5em;padding:.8em 1.1em;display:flex;flex-direction:column;justify-content:center}
.xo small{font-family:var(--hand,var(--ff));font-size:.95em;color:var(--mute);font-weight:700}
.xo p{font-size:1.45em;font-weight:900;line-height:1.35;margin-top:.15em}
.xo-was{border:3px dashed rgba(27,27,31,.3);background:rgba(255,255,255,.5)}
.xo-was p{color:#4a4650}
.xo-now{border:3px solid var(--ink);background:#fff;box-shadow:6px 6px 0 var(--ink)}
.xo-now p b{color:var(--coral);background:linear-gradient(transparent 62%,rgba(255,212,59,.75) 62%)}
.xo-arr{align-self:center;font-style:normal;font-size:2.4em;font-weight:900;color:var(--coral)}
.xo-goal{display:flex;flex-wrap:wrap;gap:.6em 1em;margin-top:1.4em}
.xo-goal li{display:flex;align-items:center;gap:.5em;font-size:1.15em;font-weight:900;background:#fff;border:2.5px solid var(--ink);border-radius:99px;padding:.25em .9em .25em .3em}
.xo-goal b{display:inline-flex;align-items:center;justify-content:center;width:1.6em;height:1.6em;border-radius:50%;background:var(--ink);color:#fff;font-size:.85em}
.xo-goal .tg{font-size:.6em}

/* 차시 닫는 장: 확인 + 다음 차시로 가는 다리 */
.xc-check{display:grid;grid-template-columns:repeat(3,1fr);gap:1em;margin-top:1.3em}
.xc-check li{display:flex;gap:.6em;align-items:flex-start;font-size:1.25em;font-weight:900;line-height:1.35;background:#fff;border:2.5px solid var(--ink);border-radius:.5em;padding:.7em .9em}
.xc-check i{flex:none;width:1.1em;height:1.1em;margin-top:.12em;border:3px solid var(--ink);border-radius:4px;position:relative}
.xc-check li.on i::after{content:"✓";position:absolute;left:.05em;top:-.42em;font-size:1.3em;color:var(--purple);font-style:normal}
.bridge{margin-top:1.4em;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:1.2em;align-items:center;background:var(--ink);color:#fff;border-radius:.6em;padding:.9em 1.4em}
.bridge small{grid-row:1/3;font-family:var(--hand,var(--ff));font-size:1.4em;color:var(--hl,#FFD43B);font-weight:700}
.bridge p{font-size:1.5em;font-weight:900;line-height:1.3}
.bridge p b{color:var(--hl,#FFD43B)}
.bridge em{grid-column:2;font-style:normal;font-size:1em;opacity:.8;font-weight:700}
.bridge .to{grid-row:1/3;grid-column:3;font-weight:900;font-size:1.2em;border:3px solid #fff;border-radius:8px;padding:.15em .6em;transform:rotate(-3deg);white-space:nowrap}

/* 지난주 → 오늘: 게임 블록이 보드 블록이 된다 */
.rc3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2em;margin-top:1.3em}
.rc3 li{background:#fff;border:2.5px solid var(--ink);border-radius:.5em;box-shadow:5px 5px 0 var(--ink);padding:.8em 1em 1em;display:flex;flex-direction:column;align-items:flex-start}
.rc3 b{font-size:2em;font-weight:900;color:var(--coral);line-height:1.1}
.rc3 .g{font-size:1.05em;color:var(--mute);margin-top:.5em}
.rc3 i{font-style:normal;font-size:1.4em;font-weight:900;color:var(--coral);margin:.15em 0}
.rc3 .r{font-size:1.2em;font-weight:900;line-height:1.35;flex:1}
.rc3 em{font-style:normal;margin-top:.7em;font-size:.8em;font-weight:900;padding:.15em .7em;border-radius:99px;border:2px solid var(--ink)}

/* 기준값 막대 */
.bl{margin-top:1.4em}
.bl-bar{position:relative;padding:2.6em 0 .5em}
.bl-track{position:relative;height:1em;border-radius:99px;background:linear-gradient(90deg,#2a2f4a,#8a8fb0 40%,#fff3b0 75%,#ffd43b);border:3px solid var(--ink)}
.bl-track i{position:absolute;top:50%;width:1.3em;height:1.3em;margin:-.65em 0 0 -.65em;border-radius:50%;border:3px solid var(--ink);background:#fff}
.bl-track .bl-cut{width:.35em;height:2.6em;margin:-1.3em 0 0 -.175em;border-radius:3px;background:var(--purple);border:0}
.bl-lab{position:relative;height:2.4em}
.bl-lab span{position:absolute;top:.5em;transform:translateX(-50%);white-space:nowrap;font-weight:900;font-size:1.1em}
.bl-lab span b{font-size:1.4em;color:var(--coral)}
.bl-lab .cut{top:-4.1em;color:var(--purple)}
.bl-lab .cut b{color:var(--purple)}
.bl-ex{font-family:var(--hand,var(--ff));color:var(--mute);font-size:.9em;margin-top:.4em}
.bl .frame{margin-top:.8em}

/* 설계서 */
.ds{display:grid;grid-template-columns:1.55fr 1fr;gap:1.4em;margin-top:1.1em;align-items:stretch}
.ds-form{display:grid;grid-template-columns:1fr 1fr;gap:.6em}
.ds-form > div{background:#fff;border:2.5px solid var(--ink);border-radius:.4em;padding:.45em .8em .55em}
.ds-form dt{font-family:var(--hand,var(--ff));font-weight:700;color:var(--purple);font-size:.95em}
.ds-form dd{font-size:1.1em;font-weight:900;line-height:1.35}
.ds-form .in,.ds-form .if,.ds-form .out{box-shadow:5px 5px 0 var(--ink)}
.ds-form .in dd,.ds-form .if dd,.ds-form .out dd{color:var(--coral)}
.ds-sk{border:3px dashed rgba(27,27,31,.4);border-radius:.5em;padding:.8em 1em;background:#fff url(theme/d2_note.png) center 70%/62% no-repeat;display:flex;flex-direction:column}
.ds-sk p{font-weight:900;font-size:1.2em}
.ds-sk small{font-family:var(--hand,var(--ff));color:var(--mute);font-size:.95em}

/* 두 번 시험 표 */
.x-test .t2{width:100%;margin-top:1.2em}

/* 발표 모드 크기 */
body[data-mode="present"] .x-open .xo p{font-size:44px}
body[data-mode="present"] .x-open .xo-goal li{font-size:34px}
body[data-mode="present"] .x-close .xc-check li{font-size:36px;min-height:150px}
body[data-mode="present"] .x-close .bridge p{font-size:46px}
body[data-mode="present"] .x-recap .rc3 .r{font-size:38px}
body[data-mode="present"] .x-recap .rc3 .g{font-size:30px}
body[data-mode="present"] .x-base .bl-lab span{font-size:34px}
body[data-mode="present"] .x-base .frame{font-size:48px}
body[data-mode="present"] .x-design .ds-form dd{font-size:32px}
body[data-mode="present"] .x-design .ds{height:600px}
body[data-mode="present"] .x-test .t2{font-size:40px}
@media (max-width:820px){.xo,.xc-check,.rc3,.ds,.ds-form{grid-template-columns:1fr}.xo-arr{transform:rotate(90deg);justify-self:center}.bridge{grid-template-columns:1fr}.bridge small,.bridge .to{grid-row:auto;grid-column:auto}}
/* 효과 끔: 표지 회로는 첫 장면(투명)에서 멈추지 않고 다 보이게 */
body.lite .circuit .grp{animation:none!important;opacity:1}
body.lite .circuit .wires{opacity:1;transition:none}
.dark-circuit.out-on .ring image.r-on{filter:none}
.dark-circuit .ring::before{content:none}

/* ===== 빈 화면 점검(KIT.audit)에서 걸린 장면 채우기 ===== */
body[data-mode="present"] .x-open .xo{margin-top:56px}
body[data-mode="present"] .x-open .xo > div{min-height:300px}
body[data-mode="present"] .x-open .xo-goal{margin-top:64px;gap:22px 26px}
body[data-mode="present"] .x-open .xo-goal li{font-size:40px;padding:10px 30px 10px 12px}
body[data-mode="present"] .x-close .xc-check{margin-top:56px;gap:30px}
body[data-mode="present"] .x-close .xc-check li{min-height:230px;font-size:40px;padding:26px 28px}
body[data-mode="present"] .x-close .bridge{margin-top:56px;padding:34px 44px}
body[data-mode="present"] .s-read .limits{margin-top:80px;gap:60px}
body[data-mode="present"] .s-read .limits h3{font-size:56px}
body[data-mode="present"] .s-read .limits p{font-size:36px}
body[data-mode="present"] :is(.s-safe,.s-fix,.b-ins) > :not(.head):not(.txt):not(.nt){zoom:1.18}
body[data-mode="present"] .s-block .ezprog{zoom:1.2}
body[data-mode="present"] .x-sandbox .nums li{font-size:52px;margin-top:40px}