/* watch3.css — the "colors" board (Chabura-opener style). Loaded after watch2.css. Prototype 2026-10-07. */
.wv3{--navy:#24406b;--sky:#2f8fc4;--amber:#e8912a;--dim:#9aa3ad;
 --ct:#1a1a1a;--cr:#b8323a;--cp:#2d7a3e;--ctana:#b8902a;--cb:#1f5fa8;--cg:#8B4513;--cn:#6b3a8a;--fu:#c0399c}
.wv3 .w-layer{align-items:flex-start;justify-content:flex-start;padding:26px 28px}
.d-beat{width:100%;font-family:'Source Sans 3',system-ui,sans-serif}
.d-kick{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:#6b7686}
.d-title{font-family:'EB Garamond',Georgia,serif;font-size:clamp(24px,2.5vw,33px);line-height:1.12;margin:4px 0 18px;color:#1c2a3d;font-weight:600}
.d-body{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.d-stack{flex-direction:column;align-items:stretch}
.d-grid{display:grid;grid-template-columns:1fr 1fr}
.d-time{flex-wrap:wrap}
.d-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.d-col{display:flex;flex-direction:column;gap:10px}
.d-colh{font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:#fff;background:#24406b;border-radius:10px;padding:8px 12px;text-align:center}
.d-col+ .d-col .d-colh{background:var(--amber)}
/* every item pops in */
.d-it{opacity:0;transform:translateY(14px) scale(.7);transition:opacity .35s ease,transform .5s cubic-bezier(.34,1.56,.64,1)}
.d-it.in{opacity:1;transform:none}
.d-card{border-radius:14px;padding:12px 18px;color:#fff;box-shadow:0 6px 16px rgba(30,40,60,.16);display:flex;flex-direction:column;min-width:120px}
.d-card b{font-size:21px;line-height:1.15}.d-card b[dir=rtl]{font-family:'Frank Ruhl Libre',serif;font-size:23px;font-weight:500}
.d-card small{font-size:14.5px;opacity:.9;margin-top:2px}
.d-chip{border-radius:999px;padding:7px 15px;font-size:15.5px;font-weight:700;color:#fff;box-shadow:0 3px 10px rgba(30,40,60,.12)}
.d-big{font:800 96px/1 'Source Sans 3',sans-serif;color:#fff;width:150px;height:150px;border-radius:28px;display:grid;place-items:center;box-shadow:0 10px 26px rgba(232,145,42,.35)}
.d-arrow{font-size:28px;color:#8a93a0;font-weight:700}
.k-navy{background:var(--navy)}.k-sky{background:var(--sky)}.k-amber{background:linear-gradient(135deg,#f2a93b,#e07a1f)}.k-dim{background:var(--dim)}
.k-ok{background:var(--cp)}.k-no{background:var(--cr)}.k-gold{background:var(--ctana)}.k-pasuk{background:var(--cg)}
/* a piece of the Mishnah: its color-coding color, labeled with what the color means */
.d-phr{display:flex;flex-direction:column;gap:2px;border-radius:14px;padding:10px 16px;background:#fff;border:2px solid var(--pc);border-left-width:10px;box-shadow:0 5px 14px rgba(30,40,60,.10)}
.d-phr .d-role{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--pc)}
.d-phr .d-en{font-family:'EB Garamond',Georgia,serif;font-size:21px;line-height:1.25;color:#1c1a16}
.c-ct{--pc:var(--ct)}.c-cr{--pc:var(--cr)}.c-cp{--pc:var(--cp)}.c-ctana{--pc:var(--ctana)}.c-cb{--pc:var(--cb)}.c-cg{--pc:var(--cg)}.c-cn{--pc:var(--cn)}.c-fu{--pc:var(--fu)}
.c-cr,.c-cp,.c-ctana,.c-cn,.c-cb,.c-cg,.c-fu{background:color-mix(in srgb,var(--pc) 9%,#fff)}
/* the running count: five for 17 Tammuz, five for 9 Av */
.d-tally{display:flex;gap:7px;align-items:center;margin:-8px 0 16px}
.d-dot{width:22px;height:22px;border-radius:50%;border:2px solid #c9cfd8;background:#fff;opacity:1;transform:none;transition:background .3s,border-color .3s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.d-dot.in{transform:scale(1.12)}.d-dot.g-a.in{background:var(--navy);border-color:var(--navy)}.d-dot.g-b.in{background:var(--amber);border-color:var(--amber)}
.d-sep{width:14px}
@media (max-width:760px){
 .wv3 .w-layer{padding:12px 14px;overflow:hidden}
 .d-title{font-size:20px;margin-bottom:10px}.d-kick{font-size:10.5px}
 .d-body,.d-cols{gap:7px}.d-col{gap:6px}
 .d-card{padding:7px 11px;border-radius:11px;min-width:0}.d-card b{font-size:16px}.d-card small{font-size:12px}
 .d-chip{font-size:12.5px;padding:5px 11px}.d-phr{padding:6px 10px;border-left-width:7px}.d-phr .d-en{font-size:16px}.d-phr .d-role{font-size:9.5px}
 .d-big{width:84px;height:84px;font-size:54px;border-radius:18px}.d-arrow{font-size:18px}
 .d-tally{margin:-4px 0 8px;gap:4px}.d-dot{width:14px;height:14px}
 .wv3 .w-board{height:42vh}
}
@media (prefers-reduced-motion:reduce){.d-it{transition:opacity .2s;transform:none}}
.d-stack .d-chip,.d-stack .d-card{align-self:flex-start}
.d-time .d-chip{flex-basis:100%;max-width:max-content}