/* S91 Weather 섞은 판: 합친 판 블록 끝에 붙인 조각(weather_mix.py). .wx-mix 아래만. S96에서 안 쓰는 규칙(표 · 막대 · 타임라인 · 옛 쌍 · 후보 격자) 지움
   12칸 · 8px 배수 · 이징/시간 = style.css 토큰. 강조 = --ui(Weather 하늘), 칸 바탕 = --wx-cell(weather.css) */
.wx-mix{--t-ch:clamp(20px,1.5vw,28px);--cg:12px;--ph:color-mix(in srgb,var(--ink) 7%,var(--paper));display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);margin-top:var(--gap-s)}
.wx-mix,.wx-mix>*{grid-column:1/-1}  /* 블록(.fe-b)이 그리드라 바깥도 전체 폭 */
.wx-mix figcaption,.wx-mix .wx-cap{font-size:var(--r-cap);line-height:1.5;color:var(--muted)}
.wx-mix figure{margin:0}
.wx-mix figure figcaption{margin-top:8px}
.wx-mix .wx-cap{margin-top:16px}

/* S96 벤토 칸: 같은 크기(정사각) · 라운드 · 간격 12px, 바탕 연한 하늘. 꽉 자른 캐릭터(is-ch) = 키 72%, 발 = 아래 10% 선. 확정(is-fin) = 강조색 테두리 */
.wx-mix .wx-cell{margin:0;min-width:0}
.wx-mix .wx-cell-m{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:var(--wx-r);background:var(--wx-cell)}
.wx-mix .wx-cell-m>:is(img,video){position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:0}
.wx-mix .wx-cell.is-ch .wx-cell-m>img{top:auto;bottom:10%;height:72%;object-position:50% 100%}

.wx-mix .wx-cell figcaption{margin-top:8px;font-size:var(--r-lab);line-height:1.4}
.wx-mix .wx-cell figcaption b{font-weight:500;color:var(--ui)}

/* ⑤ 손키: 확인용 출력 칸(600 × 700) */
.wx-mix .wx-an{grid-column:1/span 7;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--cg);margin-top:16px}
.wx-mix .wx-an .wx-cell-m{aspect-ratio:6/7}
.wx-mix .wx-an .wx-cell-m>video{object-fit:cover}

/* S95 ④ OCT002 Draft 구성: 우선순위(왼쪽) + 시안 위 요지 표시(오른쪽), 07.20 ~ 07.23 시안 3장 */
.wx-mix .wx-annot-row{display:grid;grid-template-columns:subgrid;align-items:center;margin-top:24px}
.wx-mix .wx-prio{grid-column:7/-1}  /* S99: 핀 시안 왼쪽 · 우선순위 오른쪽 */
.wx-mix .wx-prio ol{list-style:none;margin:16px 0;padding:0;counter-reset:p}
.wx-mix .wx-prio li{counter-increment:p;display:grid;grid-template-columns:2.4em minmax(0,1fr);gap:4px 16px;padding:20px 0;border-top:1px solid var(--line)}
.wx-mix .wx-prio li:last-child{border-bottom:1px solid var(--line)}
.wx-mix .wx-prio li::before{content:counter(p);grid-row:span 2;font-family:Montreal,var(--f);font-size:clamp(40px,3vw,56px);line-height:1;color:var(--ui)}
.wx-mix .wx-prio b{font-size:var(--t-ch);font-weight:500;line-height:1.3}
.wx-mix .wx-prio span{font-size:var(--r-body);color:var(--muted)}
.wx-mix .wx-annot{grid-column:1/span 4;position:relative}
.wx-mix .wx-annot>div{position:relative}
.wx-mix .wx-annot img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:top}
.wx-mix .wx-pin{position:absolute;left:var(--x);top:var(--y);display:flex;gap:8px;align-items:flex-start;max-width:var(--w,64%);padding:8px 12px 8px 8px;border-radius:12px;background:#fff;color:var(--ink);font-size:var(--r-cap);line-height:1.45;box-shadow:0 10px 24px -12px rgb(8 22 40 / .5)}
.wx-mix .wx-pin i{flex:none;display:grid;place-items:center;width:1.7em;height:1.7em;border-radius:50%;background:var(--ui);color:#fff;font:600 11px/1 Montreal,var(--f);font-style:normal}
.wx-mix .wx-pin.is-warn i{background:#e2563b}  /* OCT002 경고 점 색 그대로(그림 위 표시에만) */

/* ⑦ 최종 전달(S99): 층 9장 반복(weather_mix.py WX_LOOP_JS). 기본(JS 없음 · 동작 줄이기) = 정면 한 장(data-s=in). out = 01 ~ 09가 옆으로 차례로 나옴(겹쳐 펼침), 기울기 없음
   판 테두리 = 먹 1px(칸 변 = 판 변), 모서리 = S25, 나와 있을 때만 층 번호 */

/* S97 옷 줄 = S95 배열(벤토: 영상 2 × 2 · 그림 1칸, 0~27도 후보 ↔ 헤드셋안 짝) */

.wx-mix .wx-cap2{display:grid;grid-template-columns:subgrid;align-items:start}

/* ⑤ Rain 차례 재생: 지금 재생 칸만 진하게(JS 있을 때만) */
.wx-mix .wx-seq.is-run .wx-cell{opacity:.45;transition:opacity var(--t-2) var(--ease-out)}
.wx-mix .wx-seq.is-run .wx-cell.is-on{opacity:1}

.wx-mix .wx-sm{margin:40px 0 0;font-size:var(--r-lab)}  /* ⑤ 옛 줄 머리(제작 비교 · Rain · 요구와 대안) = 작은 캡션 */

/* 지시서 16 BX: p5 전 → 후 2쌍 */

@media(max-width:1100px){
  .wx-mix .wx-an{grid-column:1/-1}
}
@media(max-width:700px){

 .wx-mix .wx-an{grid-template-columns:repeat(2,minmax(0,1fr))}
 .wx-mix :is(.wx-prio,.wx-annot){grid-column:1/-1}
 .wx-mix .wx-annot-row{row-gap:32px}
}