/* 세계 회의 시간 계산기 전용 CSS (2026-10-13). 2패널 + 참가자 줄 목록(subgrid) + 하루 시간표(30분 칸·회의 띠 이동 R45·지금 선). 공용 부품은 assets/v2.css */
.wm-work{container:wm/inline-size;--wm-cw:15px;--wm-w:color-mix(in srgb,var(--accent) 40%,var(--paper));--wm-e:color-mix(in srgb,var(--muted) 16%,var(--paper));--wm-k:color-mix(in srgb,var(--muted) 30%,var(--paper));--wm-hatch:repeating-linear-gradient(135deg,transparent 0 3px,color-mix(in srgb,var(--muted) 55%,transparent) 3px 4.5px);--wm-n:color-mix(in srgb,var(--ink) 72%,var(--paper));--wm-nt:var(--paper)}
:root[data-theme="dark"] .wm-work{--wm-n:#0d0905;--wm-nt:var(--muted);--wm-e:color-mix(in srgb,var(--muted) 44%,var(--paper))}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .wm-work{--wm-n:#0d0905;--wm-nt:var(--muted);--wm-e:color-mix(in srgb,var(--muted) 44%,var(--paper))} }
.wm-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.wm-in{padding:16px 18px 18px;min-width:0}
.wm-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wm-fields .v2-f{min-width:0}
.wm-fields .v2-f.full{grid-column:1/-1}
.wm-fields .v2-f > .v2-label{display:block}
.wm-ctl,.wm-sel{display:block;width:100%;max-width:100%;height:var(--v2-ctl,42px);padding:0 8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14.5px;font-weight:600;box-sizing:border-box;min-width:0;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.wm-ctl{margin-top:6px}
.wm-ctl:focus-visible,.wm-sel:focus-visible,.wm-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wm-ctl[aria-invalid="true"],.wm-sel[aria-invalid="true"]{border-color:var(--accent)}
.wm-seg{margin-top:6px;display:flex;flex-wrap:nowrap}
.wm-seg button{flex:1 1 0;min-width:0;height:var(--v2-ctl,42px);padding:0 6px;font-family:var(--sans);font-size:13px;font-weight:700;white-space:nowrap}
.wm-hint{display:block;margin-top:5px;font-family:var(--sans);font-size:12px;line-height:1.5;color:var(--muted)}
.wm-pbox{margin-top:16px;padding-top:14px;border-top:1px solid var(--soft)}
.wm-pbox > .v2-label{display:block;margin-bottom:6px}
.wm-phead,.wm-p{display:grid;grid-template-columns:minmax(0,1fr) var(--wm-hw,86px) var(--wm-hw,86px) 34px;gap:6px;align-items:center}
.wm-work[data-clock="12"]{--wm-hw:112px}
.wm-phead{font-family:var(--sans);font-size:11.5px;font-weight:700;color:var(--muted);padding-bottom:4px}
.wm-people{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.wm-pc{position:relative;min-width:0;container-type:inline-size}
.wm-p.is-base .wm-sel[data-f="id"]{padding-right:52px;border-color:var(--ink)}
.wm-tag{position:absolute;right:26px;top:50%;transform:translateY(-50%);font-family:var(--sans);font-size:11px;font-weight:800;color:var(--accent);pointer-events:none}
@container (max-width:179px){ .wm-tag{display:none} .wm-p.is-base .wm-sel[data-f="id"]{padding-right:8px} }
.wm-x{width:34px;height:var(--v2-ctl,42px);display:inline-flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--muted);cursor:pointer}
.wm-x svg{width:14px;height:14px}
.wm-x:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}
.wm-x:disabled{opacity:.35;cursor:default}
.wm-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:12px}
.wm-acts svg{width:16px;height:16px}
.wm-acts .wm-hint{margin:0}
.wm-help{margin:12px 0 0;font-family:var(--sans);font-size:12.5px;line-height:1.6;color:var(--muted)}
.wm-out{padding:16px 18px 18px;min-width:0;border-left:1px solid var(--soft);display:flex;flex-direction:column}
.wm-out > .v2-label{display:block;margin-bottom:6px}
.wm-out .v2-big span{font-size:clamp(30px,6.4cqi,44px)}
.wm-out .v2-big.is-empty span{font-size:18px;font-weight:600;color:var(--muted)}
.wm-rows{margin-top:12px}
.wm-rows li{align-items:flex-start;gap:10px}
.wm-rows li span{min-width:0;flex:0 1 auto;max-width:46%}
.wm-rows li span small{display:block;margin-top:2px;font-size:11.5px;font-weight:500;color:var(--muted)}
.wm-rows li b{min-width:0;flex:1 1 auto;text-align:right;font-variant-numeric:tabular-nums;white-space:normal;overflow-wrap:anywhere}
.wm-rows li b small{font-weight:600;color:var(--muted)}
.wm-rows li b em{font-style:normal;font-size:12px;font-weight:700;color:var(--accent);margin-left:4px}
.wm-st{display:block;margin-top:2px;font-style:normal;font-size:12px;font-weight:600;color:var(--muted)}
.wm-st::before{content:"";display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:2px;vertical-align:-1px;background:var(--wm-e);border:1px solid var(--line)}
.wm-st.st-w::before{background:var(--wm-w);box-shadow:inset 0 3px 0 var(--accent)}
.wm-st.st-k::before{background:var(--wm-hatch),var(--wm-k)}
.wm-st.st-n::before{background:var(--wm-n)}
.wm-sublabel{display:block;margin-top:14px;margin-bottom:6px}
.wm-picks{display:flex;flex-wrap:wrap;gap:6px}
.wm-chip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:7px 10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--ink);font-family:var(--sans);cursor:pointer;text-align:left}
.wm-chip b{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}
.wm-chip span{font-size:11.5px;font-weight:600;color:var(--muted)}
.wm-chip:hover{border-color:var(--ink)}
.wm-chip[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.wm-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wm-wins{display:flex;gap:10px;justify-content:space-between;margin:12px 0 0;font-family:var(--sans);font-size:13px;color:var(--muted)}
.wm-wins b{color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.wm-wk{list-style:none;margin:0;padding:0;font-family:var(--sans);font-size:13px;line-height:1.55;color:var(--ink)}
.wm-wk li{padding:3px 0 3px 14px;position:relative}
.wm-wk li::before{content:"";position:absolute;left:2px;top:.75em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.wm-caveat{margin:12px 0 0;font-family:var(--sans);font-size:12px;line-height:1.55;color:var(--muted)}
.wm-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:auto;padding-top:12px;border-top:1px solid var(--soft)}
.wm-caveat + .wm-foot{margin-top:14px}
.wm-foot .v2-status{margin-left:auto}
.wm-chartbox{padding:14px 18px 16px;border-top:1px solid var(--soft);min-width:0;max-width:100%}
.wm-chartbox > .v2-label{display:block;margin-bottom:8px}
.wm-keys{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;font-family:var(--sans);font-size:12px;color:var(--muted)}
.wm-keys li::before{content:"";display:inline-block;width:14px;height:10px;margin-right:6px;border-radius:2px;vertical-align:-1px;border:1px solid var(--line)}
.wm-keys .k-w::before{background:var(--wm-w);box-shadow:inset 0 3px 0 var(--accent)}
.wm-keys .k-e::before{background:var(--wm-e)}
.wm-keys .k-k::before{background:var(--wm-hatch),var(--wm-k)}
.wm-keys .k-n::before{background:var(--wm-n)}
.wm-keys .k-m::before{background:transparent;border:2px solid var(--accent)}
.wm-tl{display:flex;align-items:flex-start;min-width:0}
.wm-names{flex:0 0 120px;width:120px;padding-right:8px;font-family:var(--sans);box-sizing:border-box}
.wm-names span{display:block;overflow:hidden}
.wm-names .nh{height:18px}
.wm-names .na{height:22px;margin-bottom:4px;font-size:11px;font-weight:600;line-height:22px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis}
.wm-names .nm{height:26px;margin-top:2px;display:flex;flex-direction:column;justify-content:center;line-height:1.15}
.wm-names .nm b{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wm-names .nm small{font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.wm-names .nm.is-base b{color:var(--accent)}
.wm-scroll{flex:1 1 auto;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:20px}
.wm-board{position:relative;width:calc(var(--n,48) * var(--wm-cw));font-family:var(--sans);font-variant-numeric:tabular-nums;cursor:pointer;user-select:none}
.wm-hours,.wm-av,.wm-row{display:grid;grid-template-columns:repeat(var(--n,48),var(--wm-cw))}
.wm-hours{height:18px}
.wm-hours .h{position:relative;font-size:10.5px;line-height:18px;color:var(--muted);white-space:nowrap;overflow:visible}
.wm-hours .h.is-h{border-left:1px solid var(--soft);padding-left:2px}
.wm-av{height:22px;margin-bottom:4px;align-items:end;border-bottom:1px solid var(--soft)}
.wm-av .b{display:flex;align-items:flex-end;height:100%;padding:0 1px;box-sizing:border-box}
.wm-av .b i{display:block;width:100%;background:var(--muted);opacity:.38;border-radius:1px 1px 0 0;transition:height .3s cubic-bezier(.22,1,.36,1)}
.wm-av .b.is-all i{background:var(--accent);opacity:1}
.wm-row{height:26px;margin-top:2px}
.wm-row .c{position:relative;display:block;height:26px;background:var(--c1,var(--wm-e));font-size:10.5px;font-weight:600;line-height:26px;padding-left:2px;color:var(--ink);white-space:nowrap;overflow:visible;box-sizing:border-box}
.wm-row .c > i{position:relative;z-index:1;font-style:normal}
.wm-row .st-w{--c1:var(--wm-w)}
.wm-row .st-e{--c1:var(--wm-e)}
.wm-row .st-k{--c1:var(--wm-k)}
.wm-row .st-n{--c1:var(--wm-n);color:var(--wm-nt)}
.wm-row .to-w{--c2:var(--wm-w)}
.wm-row .to-e{--c2:var(--wm-e)}
.wm-row .to-k{--c2:var(--wm-k)}
.wm-row .to-n{--c2:var(--wm-n)}
.wm-row .c[class*=" to-"]{background:linear-gradient(90deg,var(--c1) 50%,var(--c2) 50%)}
.wm-row .st-k[class*=" to-"]{background:linear-gradient(90deg,transparent 50%,var(--c2) 50%),var(--wm-hatch),var(--wm-k)}
.wm-row .c.to-k{background:linear-gradient(90deg,var(--c1) 50%,transparent 50%),var(--wm-hatch),var(--wm-k)}
.wm-row .c::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;pointer-events:none}
.wm-row .st-w::before{background:var(--accent)}
.wm-row .st-w[class*=" to-"]::before{right:50%}
.wm-row .c.to-w::before{left:50%;background:var(--accent)}
.wm-row .st-k:not([class*=" to-"]){background:var(--wm-hatch),var(--wm-k)}
.wm-row .is-day{box-shadow:inset 2px 0 0 var(--ink);font-weight:800}
.wm-row .c:hover{filter:brightness(.94)}
.wm-band{position:absolute;top:44px;bottom:0;left:calc(var(--i,0) * var(--wm-cw));width:calc(var(--l,2) * var(--wm-cw));box-sizing:border-box;border:2px solid var(--accent);border-radius:3px;background:color-mix(in srgb,var(--accent) 8%,transparent);pointer-events:none;z-index:2;transition:left .28s cubic-bezier(.22,1,.36,1),width .28s cubic-bezier(.22,1,.36,1)}
.wm-now{position:absolute;top:0;bottom:0;left:calc(var(--x,0) * var(--wm-cw));width:0;border-left:1.5px dashed var(--ink);pointer-events:none;z-index:3}
.wm-now b{position:absolute;bottom:-17px;left:3px;padding:0 3px;font-size:10px;font-weight:700;line-height:16px;color:var(--ink);background:var(--paper);white-space:nowrap}
.wm-note{margin:8px 0 0;font-family:var(--sans);font-size:12px;line-height:1.55;color:var(--muted)}
.wm-swipe{display:none}
@media (prefers-reduced-motion:reduce){ .wm-band,.wm-av .b i{transition:none} }
@container wm (max-width:779px){
  .wm-grid{grid-template-columns:minmax(0,1fr)}
  .wm-out{order:-1;border-left:0;border-bottom:1px solid var(--soft)}
  .wm-swipe{display:block}
}
@container wm (max-width:440px){
  .wm-in,.wm-out,.wm-chartbox{padding-left:14px;padding-right:14px}
  .wm-phead{display:none}
  .wm-p{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 34px;row-gap:4px;padding-bottom:6px;border-bottom:1px dashed var(--soft)}
  .wm-pc{grid-column:1/-1}
  .wm-names{flex-basis:88px;width:88px}
}
@container wm (max-width:340px){ .wm-fields{grid-template-columns:minmax(0,1fr)} .wm-fields .v2-f.full{grid-column:auto} .wm-seg button{font-size:12px;padding:0 3px} }