/* watch2.css — one watch view: whiteboard left, the Mishnah building itself right (prototype v2) */
body.wv{margin:0;padding:0;background:#f4eee0;color:#1c1a16;font-family:'EB Garamond',Georgia,serif;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;max-width:none}
.wv *{box-sizing:border-box}
.w-top{display:flex;align-items:center;gap:14px;padding:8px 16px;background:#0f1b2b;color:#f4e9d2;font-family:'Source Sans 3',sans-serif;font-size:14px;min-height:52px}
.w-top a{color:#e0be6b;text-decoration:none;font-weight:600;min-height:44px;display:inline-flex;align-items:center}
.w-title{flex:1;text-align:center}.w-title i{opacity:.65;font-weight:400;margin-left:6px}
.w-stage{position:relative;flex:1;min-height:0;margin:14px auto 0;width:min(1200px,calc(100% - 24px));background:#fffdf7;border:1px solid #e3dcc8;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(60,45,20,.10);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.w-board{position:relative;border-right:1px dashed #e3dcc8;min-height:0}
.w-layer{position:absolute;inset:0;padding:26px 30px;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s linear .45s;display:flex;align-items:center;justify-content:center}
.w-layer.on{opacity:1;visibility:visible;transition:opacity .45s ease}
.b-scene{width:100%;text-align:center}
.b-art{color:#1B2140;display:flex;justify-content:center}
.b-art .sketch{width:100%;max-height:min(42vh,340px);height:auto;display:block;overflow:visible}
.b-scene h2{font-size:clamp(24px,2.6vw,34px);line-height:1.15;margin:14px 0 6px;font-weight:600}
.b-scene p{font-size:19px;color:#5c5545;margin:0;font-style:italic}
.b-pic{width:100%;border-radius:14px;border:1px solid #e3dcc8}
.b-tag{font-family:'Source Sans 3',sans-serif;font-size:20px;background:#efe6d2;border-radius:12px;padding:12px 18px;display:inline-block}.b-tag b{color:#7c1f2b}
.b-struct{width:100%}
.sketch path{fill:none;stroke:currentColor;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--l,0);stroke-dashoffset:var(--l,0);transition:stroke-dashoffset 1.1s ease var(--d,0s)}
.sketch path.r{stroke:#b8323a}.sketch path.f{fill:currentColor}
.sketch .tx{fill:#1B2140;font-family:'Source Sans 3',sans-serif;font-weight:700;opacity:0;transition:opacity .6s ease 1s}
.w-layer.on .sketch path{stroke-dashoffset:0}.w-layer.on .sketch .tx{opacity:1}
/* the Mishnah, building itself */
.w-build::after{content:"";display:block;height:30vh}
.w-text{padding:22px 28px;overflow:clip;display:flex;flex-direction:column;min-height:0}
.w-cite{font-family:'Source Sans 3',sans-serif;color:#6b6655;font-size:15px}
.w-head h1{font-size:28px;line-height:1.15;margin:4px 0 4px;font-weight:600}
.w-topic{font-family:'Frank Ruhl Libre',serif;font-size:20px;color:#5c5545;text-align:left;line-height:1.45;padding-bottom:.22em}  /* nikud clearance (site_chrome.HE_TITLE_CSS) */
.w-build{margin-top:12px;flex:1;min-height:0;overflow-y:auto;scroll-behavior:smooth;padding:4px 6px 0 2px;-webkit-mask-image:linear-gradient(#000 85%,transparent);mask-image:linear-gradient(#000 85%,transparent)}
.w-build .he{font-family:'Frank Ruhl Libre',serif;font-size:clamp(24px,2.4vw,32px);line-height:1.75;background:none;border:0;padding:0;margin:0;text-align:right}
.w-build .phr{opacity:0;transition:opacity .5s ease,background-color .3s;border-radius:4px}
.w-build .phr.shown{opacity:1}
.w-build .phr.now{background:#f6e3a6;box-shadow:0 0 0 3px #f6e3a6}
.w-head{flex:none}.w-now{flex:none;margin-top:14px;font-size:21px;line-height:1.4;color:#3d3a31;min-height:2.8em;border-top:1px dashed #e3dcc8;padding-top:10px}
.w-start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;display:inline-flex;gap:12px;align-items:center;font:700 20px 'Source Sans 3',sans-serif;background:#7c1f2b;color:#fff;border:0;border-radius:999px;padding:16px 34px;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.25),0 0 0 3000px rgba(255,253,247,.72)}
.w-start[hidden]{display:none}
.w-tri{display:inline-block;width:0;height:0;border-left:14px solid currentColor;border-top:9px solid transparent;border-bottom:9px solid transparent}
.w-cap{flex:none;width:min(1200px,calc(100% - 24px));margin:8px auto 0;min-height:54px;font-family:'Source Sans 3',sans-serif;font-size:19px;line-height:1.4;color:#3d3a31;text-align:center}
.w-cap b{color:#7c1f2b}
body.nocc .w-cap{visibility:hidden}
@media (max-width:760px){body.nocc .w-cap{display:none}}
.w-bar{flex:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 16px;background:#fffdf7;border-top:1px solid #e3dcc8;font-family:'Source Sans 3',sans-serif}
.w-btn{min-width:44px;min-height:44px;border-radius:999px;border:1.5px solid #d4c6a6;background:#fff;color:#1a2d5a;font-size:22px;cursor:pointer;display:grid;place-items:center}
.w-play{background:#7c1f2b;border-color:#7c1f2b;color:#fff;width:54px;height:54px}
body.playing .w-play .w-tri{width:16px;height:18px;border:0;border-left:5px solid #fff;border-right:5px solid #fff}
.w-track{position:relative;flex:1;min-width:120px;height:10px;background:#eadfca;border-radius:5px;cursor:pointer}
.w-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:#C79A37;border-radius:5px}
.w-tick{position:absolute;top:-4px;width:3px;height:18px;background:#24354F;border-radius:2px;opacity:.55}
.w-time{font-size:14px;color:#6b6655;min-width:86px;text-align:center}
.w-chip{min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid #d4c6a6;background:#fff;color:#1a2d5a;font-weight:700;font-size:14px;cursor:pointer}
.w-chip[hidden]{display:none}.w-chip[aria-pressed="false"]{opacity:.55}
@media (max-width:760px){
 .w-title{display:none}
 .w-stage{display:flex;flex-direction:column;margin-top:8px}
 .w-board{flex:none;height:34vh;border-right:0;border-bottom:1px dashed #e3dcc8}
 .w-layer{padding:12px 14px}
 .b-art .sketch{max-height:18vh}.b-scene h2{font-size:22px;margin-top:8px}.b-scene p{font-size:16px}
 .w-text{padding:10px 16px;flex:1}.w-head h1{display:none}.w-topic{display:none}.w-cite{font-size:13px}
 .w-now{min-height:2.6em;margin-top:6px;padding-top:6px}
 .w-build .he{font-size:22px}.w-now{font-size:17px}
 .w-cap{font-size:15px;min-height:44px}
 .w-track{order:-1;flex-basis:100%}.w-time{min-width:0}
}
@media (prefers-reduced-motion:reduce){.sketch path{transition:none;stroke-dashoffset:0}.w-layer,.w-build .phr{transition:none}}
