/* Levy run demo. Self-contained, every class prefixed lv- so it cannot collide with site styles. */
.lvr{--lv-ink:#0E0E0C;--lv-ink2:#161614;--lv-ink3:#1F1F1C;--lv-rule:#2C2B27;--lv-lime:#C8FF3D;--lv-lime-soft:#EFFFC2;--lv-white:#FFFFFF;--lv-dim:#C4C1B8;--lv-faint:#8E8B83;--lv-line:#E5E2D8;--lv-amber:#FFC67A;
  --lv-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  background:var(--lv-ink);color:var(--lv-white);border-radius:24px;overflow:hidden;box-shadow:0 30px 70px rgba(14,14,12,.25);font-family:'Inter',system-ui,sans-serif;text-align:left}
.lvr *{box-sizing:border-box}
.lvr p{margin:0}
.lv-mono{font-family:var(--lv-mono);font-variant-numeric:tabular-nums}
.lv-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--lv-rule)}
.lv-mark{width:56px;flex-shrink:0}
.lv-title{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.lv-title b{font-size:15px;font-weight:700;color:var(--lv-white)}
.lv-title span{font-size:12.5px;color:var(--lv-dim)}
.lv-meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.lv-chip{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--lv-rule);border-radius:999px;padding:5px 10px;color:var(--lv-white);white-space:nowrap;display:inline-flex;align-items:center;gap:7px;line-height:1.2}
.lv-chip.live{border-color:var(--lv-lime);color:var(--lv-lime)}
.lv-chip.live i{width:7px;height:7px;border-radius:99px;background:var(--lv-lime);animation:lvBlip 1.2s infinite}
.lv-chip.you{background:var(--lv-lime);color:var(--lv-ink);border-color:var(--lv-lime)}
.lv-btn{font:inherit;font-size:12.5px;font-weight:600;color:var(--lv-white);background:transparent;border:1px solid #5A5850;border-radius:999px;padding:6px 12px;cursor:pointer;line-height:1.2}
.lv-btn:hover{border-color:var(--lv-white)}
.lv-btn:focus-visible,.lv-approve:focus-visible{outline:3px solid var(--lv-lime);outline-offset:2px}
@keyframes lvBlip{50%{opacity:.25}}
.lv-body{display:grid;grid-template-columns:320px minmax(0,1fr)}

/* stepper */
.lv-steps{list-style:none;margin:0;padding:16px 14px;border-right:1px solid var(--lv-rule);display:flex;flex-direction:column;gap:2px}
.lv-st{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;padding:9px 10px;border-radius:12px;transition:background .25s ease}
.lv-ic{width:24px;height:24px;border-radius:99px;border:2px solid #4A4842;display:flex;align-items:center;justify-content:center;margin-top:1px}
.lv-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.lv-r1{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lv-nm{font-size:14.5px;font-weight:600;color:var(--lv-faint)}
.lv-who{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:2px 7px;border:1px solid #4A4842;color:var(--lv-faint)}
.lv-st.person .lv-who{border-style:dashed}
.lv-sub{font-size:12.5px;color:var(--lv-dim);line-height:1.4;display:none}
.lv-st.done .lv-ic{background:var(--lv-lime);border-color:var(--lv-lime)}
.lv-st.done .lv-ic::after{content:"";width:9px;height:5px;border-left:2.5px solid var(--lv-ink);border-bottom:2.5px solid var(--lv-ink);transform:rotate(-45deg) translate(1px,-1px)}
.lv-st.done .lv-nm{color:var(--lv-white)}
.lv-st.active{background:var(--lv-ink3)}
.lv-st.active .lv-ic{border-color:var(--lv-lime);border-top-color:transparent;animation:lvSpin .8s linear infinite}
.lv-st.active .lv-nm{color:var(--lv-white)}
.lv-st.active .lv-who{border-color:var(--lv-lime);color:var(--lv-lime)}
.lv-st.active .lv-sub{display:block}
.lv-st.turn{background:var(--lv-lime)}
.lv-st.turn .lv-ic{border-color:var(--lv-ink);background:var(--lv-ink);animation:lvPulse 1.4s ease-in-out infinite}
.lv-st.turn .lv-nm{color:var(--lv-ink);font-weight:700}
.lv-st.turn .lv-who{background:var(--lv-ink);color:var(--lv-lime);border-color:var(--lv-ink)}
.lv-st.turn .lv-sub{display:block;color:var(--lv-ink)}
.lvr.paused .lv-st.active .lv-ic{animation-play-state:paused}
@keyframes lvSpin{to{transform:rotate(360deg)}}
@keyframes lvPulse{0%,100%{box-shadow:0 0 0 0 rgba(14,14,12,.45)}60%{box-shadow:0 0 0 7px rgba(14,14,12,0)}}
.lv-legend{display:flex;gap:14px;flex-wrap:wrap;padding:12px 10px 2px;margin-top:auto;font-size:12px;color:var(--lv-dim)}
.lv-legend span{display:inline-flex;align-items:center;gap:6px}
.lv-legend i{width:16px;height:16px;border-radius:99px;display:inline-block}
.lv-legend .a{border:2px solid var(--lv-lime);border-top-color:transparent}
.lv-legend .h{border:2px dashed var(--lv-faint)}

/* workspace */
.lv-ws{padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0}
.lv-ws-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lv-k{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lv-lime)}
.lv-prog{display:flex;gap:4px;flex:1;max-width:260px}
.lv-prog i{flex:1;height:5px;border-radius:99px;background:#34332E;transition:background .3s ease}
.lv-prog i.on{background:var(--lv-lime)}
.lv-prog i.now{background:var(--lv-white)}
.lv-say{font-size:clamp(19px,2.1vw,24px);font-weight:700;letter-spacing:-.02em;line-height:1.25;color:var(--lv-white)}
.lv-say b{color:var(--lv-lime);font-weight:700}
.lv-stage{position:relative;min-height:300px;background:var(--lv-ink2);border:1px solid var(--lv-rule);border-radius:16px;padding:18px;overflow:hidden;display:flex}
.lv-scene{display:none;width:100%}
.lv-scene.on{display:flex;flex-direction:column;justify-content:center;animation:lvFade .35s ease}
@keyframes lvFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lv-cap{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.5;color:var(--lv-white);background:var(--lv-ink3);border-radius:12px;padding:11px 14px}
.lv-cap b{flex-shrink:0;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lv-lime);margin-top:3px}
.lv-foot{display:flex;gap:10px;flex-wrap:wrap}
.lv-stat{flex:1;min-width:120px;background:var(--lv-ink2);border:1px solid var(--lv-rule);border-radius:12px;padding:10px 12px}
.lv-stat span{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lv-dim)}
.lv-stat strong{display:block;font-size:20px;font-weight:700;margin-top:3px;color:var(--lv-white)}
.lv-stat strong.g{color:var(--lv-lime)}

/* scene: notice */
.lv-doc{background:var(--lv-white);color:var(--lv-ink);border-radius:10px;padding:16px 18px;max-width:470px;position:relative;overflow:hidden;font-size:13px}
.lv-doc .dh{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#4A4842}
.lv-doc h4{font-size:15px;margin:4px 0 12px;font-weight:700;color:var(--lv-ink)}
.lv-fl{display:flex;justify-content:space-between;gap:12px;padding:7px 6px;border-top:1px solid var(--lv-line);border-radius:4px;transition:background .3s ease,box-shadow .3s ease}
.lv-fl span{color:#4A4842}
.lv-fl b{font-family:var(--lv-mono);font-size:12.5px;color:var(--lv-ink)}
.lv-fl.hit{background:var(--lv-lime-soft);box-shadow:inset 3px 0 0 var(--lv-ink)}
.lv-scanline{position:absolute;left:0;right:0;height:26px;top:-30px;background:linear-gradient(180deg,rgba(200,255,61,0),rgba(200,255,61,.6),rgba(200,255,61,0))}
.lv-doc.scanning .lv-scanline{animation:lvScan 1.8s ease-in-out}
@keyframes lvScan{from{top:-30px}to{top:100%}}
.lv-pulled{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.lv-pulled em{font-style:normal;font-size:12px;color:var(--lv-dim);margin-right:2px}
.lv-pc{font-size:12.5px;border:1px solid var(--lv-lime);color:var(--lv-white);border-radius:999px;padding:6px 11px;opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .3s ease}
.lv-pc.in{opacity:1;transform:none}
.lv-pc b{color:var(--lv-lime);font-family:var(--lv-mono);font-weight:600}

/* scene: register */
.lv-reg-wrap{overflow-x:auto}
.lv-reg{width:100%;border-collapse:collapse;font-size:13px;min-width:470px}
.lv-reg th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lv-dim);padding:0 8px 8px 0;border-bottom:1px solid var(--lv-rule)}
.lv-reg td{color:var(--lv-white);font-size:13px;padding:9px 8px 9px 0;border-bottom:1px solid var(--lv-rule);vertical-align:middle;transition:opacity .3s ease}
.lv-reg td.r{text-align:right;font-family:var(--lv-mono);font-size:12.5px;white-space:nowrap}
.lv-cls{display:inline-block;font-size:11.5px;font-weight:600;border-radius:999px;padding:3px 9px;border:1px solid var(--lv-rule);color:var(--lv-faint);white-space:nowrap}
.lv-cls.set{border-color:var(--lv-lime);color:var(--lv-lime)}
.lv-cls.rm{border-color:var(--lv-amber);color:var(--lv-amber)}
.lv-reg tr.cur td{background:rgba(200,255,61,.08)}
.lv-reg tr.gone td.d,.lv-reg tr.gone td.r{text-decoration:line-through;text-decoration-color:var(--lv-amber);text-decoration-thickness:2px;opacity:.55}
.lv-reg-sum{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:13.5px;color:var(--lv-dim);flex-wrap:wrap}
.lv-reg-sum b{color:var(--lv-white);font-family:var(--lv-mono)}

/* scene: exemption */
.lv-calc{max-width:540px;width:100%}
.lv-cl{display:flex;justify-content:space-between;gap:14px;padding:12px 2px;border-bottom:1px solid var(--lv-rule);font-size:15px;opacity:.25;transition:opacity .35s ease;color:var(--lv-white)}
.lv-cl.in{opacity:1}
.lv-cl b{font-family:var(--lv-mono);font-weight:600}
.lv-cl.minus b{color:var(--lv-lime)}
.lv-cl.total{border-bottom:0;border-top:1px solid var(--lv-white);font-weight:700}
.lv-save{margin-top:14px;max-width:540px;display:flex;align-items:center;gap:14px;background:var(--lv-lime);color:var(--lv-ink);border-radius:14px;padding:14px 16px;opacity:0;transform:scale(.96);transition:opacity .35s ease,transform .35s ease}
.lv-save.in{opacity:1;transform:none}
.lv-save strong{font-size:28px;font-weight:800;letter-spacing:-.03em;font-family:var(--lv-mono)}
.lv-save span{font-size:13.5px;font-weight:600;line-height:1.35}
.lv-cite{margin-top:10px;font-size:12.5px;color:var(--lv-dim)}

/* scene: review */
.lv-rv{max-width:540px;background:var(--lv-ink3);border:1px dashed #6F6C64;border-radius:14px;padding:16px}
.lv-rv-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.lv-av{width:40px;height:40px;border-radius:99px;background:var(--lv-white);color:var(--lv-ink);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.lv-rv-h b{display:block;font-size:15px;color:var(--lv-white)}
.lv-rv-h span span{font-size:12.5px;color:var(--lv-dim)}
.lv-ck{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.lv-ck li{display:flex;gap:10px;align-items:center;font-size:14px;opacity:.3;transition:opacity .3s ease;color:var(--lv-white)}
.lv-ck li.in{opacity:1}
.lv-ck li i{width:20px;height:20px;border-radius:99px;border:2px solid #6F6C64;flex-shrink:0;position:relative}
.lv-ck li.in i{background:var(--lv-white);border-color:var(--lv-white)}
.lv-ck li.in i::after{content:"";position:absolute;left:5px;top:5px;width:7px;height:4px;border-left:2.2px solid var(--lv-ink);border-bottom:2.2px solid var(--lv-ink);transform:rotate(-45deg)}
.lv-rv-note{margin-top:12px;font-size:13px;color:var(--lv-dim);line-height:1.45}
.lv-rv-ok{margin-top:12px;display:inline-flex;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--lv-white);border-radius:999px;padding:6px 11px;opacity:0;transition:opacity .3s ease;color:var(--lv-white)}
.lv-rv-ok.in{opacity:1}

/* scene: your turn */
.lv-turn{background:var(--lv-lime);color:var(--lv-ink);border-radius:16px;padding:18px;max-width:540px;display:flex;flex-direction:column;gap:12px}
.lv-turn .k{font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.lv-turn h4{font-size:22px;font-weight:800;letter-spacing:-.02em;margin:0;line-height:1.15;color:var(--lv-ink)}
.lv-turn ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14px}
.lv-turn li{display:flex;justify-content:space-between;gap:12px;border-top:1px solid rgba(14,14,12,.18);padding-top:6px;color:var(--lv-ink)}
.lv-turn li b{font-family:var(--lv-mono)}
.lv-approve{align-self:flex-start;font:inherit;font-size:15px;font-weight:700;color:var(--lv-lime);background:var(--lv-ink);border:0;border-radius:999px;padding:13px 20px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;animation:lvNudge 1.6s ease-in-out infinite}
@keyframes lvNudge{0%,100%{box-shadow:0 0 0 0 rgba(14,14,12,.35)}50%{box-shadow:0 0 0 8px rgba(14,14,12,0)}}
.lv-turn-note{font-size:12.5px;line-height:1.4}

/* scene: filed */
.lv-filed{max-width:540px;display:flex;flex-direction:column;gap:12px}
.lv-fbox{border:1px solid var(--lv-lime);border-radius:16px;padding:16px;display:flex;gap:14px;align-items:center}
.lv-fbox .big{width:46px;height:46px;border-radius:99px;background:var(--lv-lime);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.lv-fbox b{display:block;font-size:17px;color:var(--lv-white)}
.lv-fbox span span{font-size:13px;color:var(--lv-dim)}
.lv-next{background:var(--lv-ink3);border-radius:14px;padding:14px 16px;font-size:14px;line-height:1.5;display:flex;gap:10px;color:var(--lv-white)}
.lv-next i{width:9px;height:9px;border-radius:99px;background:var(--lv-lime);margin-top:6px;flex-shrink:0;animation:lvBlip 1.4s infinite}

/* badge */
.lv-badge{display:block;width:100%;height:auto;overflow:visible}
.lv-badge .base{fill:none;stroke:#34332E;stroke-width:7}
.lv-badge .prog{fill:none;stroke:var(--lv-lime);stroke-width:7;stroke-linecap:round;transform:rotate(-90deg);transform-origin:60px 60px}
.lv-badge .spin{fill:none;stroke:var(--lv-white);stroke-width:7;stroke-linecap:round;stroke-dasharray:10 90;transform-origin:60px 60px;opacity:0}
.lv-badge.work .spin{opacity:1;animation:lvSpin 1s linear infinite}
.lv-badge.review .spin{opacity:1;stroke-dasharray:4 6;animation:lvSpin 6s linear infinite}
.lv-badge.review .prog{opacity:.35}
.lv-badge .tile{fill:var(--lv-ink)}
.lv-badge .rr{stroke:var(--lv-lime)} .lv-badge .rn{fill:var(--lv-lime)} .lv-badge .rt{fill:var(--lv-ink);stroke:var(--lv-lime)}
.lv-badge.you .tile{fill:var(--lv-lime)} .lv-badge.you .rr{stroke:var(--lv-ink)} .lv-badge.you .rn{fill:var(--lv-ink)} .lv-badge.you .rt{fill:var(--lv-lime);stroke:var(--lv-ink)}
.lv-badge.you .prog{animation:lvRing 1.3s ease-in-out infinite}
@keyframes lvRing{50%{stroke-width:11;opacity:.55}}
.lv-badge .ok{opacity:0}
.lv-badge.done .ok{opacity:1}
.lvr.paused .lv-badge .spin{animation-play-state:paused}

/* phone and tablet: steps become a compact strip */
@media (max-width:900px){
  .lv-body{grid-template-columns:1fr}
  .lv-steps{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--lv-rule);padding:12px;gap:6px;scrollbar-width:none}
  .lv-steps::-webkit-scrollbar{display:none}
  .lv-st{grid-template-columns:22px auto;flex-shrink:0;padding:7px 10px;align-items:center}
  .lv-ic{width:20px;height:20px;margin-top:0}
  .lv-nm{font-size:13px;white-space:nowrap}
  .lv-who,.lv-sub,.lv-legend{display:none!important}
  .lv-st:not(.active):not(.turn) .lv-nm{display:none}
  .lv-st:not(.active):not(.turn){grid-template-columns:22px}
}
@media (max-width:560px){
  .lv-head{padding:14px 16px}
  .lv-mark{width:46px}
  .lv-ws{padding:14px}
  .lv-stage{padding:14px;min-height:0}
  .lv-stat{min-width:calc(50% - 5px)}
  .lv-prog{max-width:none;flex-basis:100%}
  .lv-meta{width:100%}
  .lv-reg{min-width:0;font-size:12.5px}
  .lv-reg th:nth-child(2),.lv-reg td:nth-child(2){display:none}
  .lv-reg td{font-size:12.5px;padding:8px 6px 8px 0}
  .lv-reg td.r{font-size:11.5px}
  .lv-cls{white-space:normal;font-size:10.5px;padding:3px 7px;line-height:1.25}
  .lv-cap{flex-direction:column;gap:4px}
  .lv-cap b{margin-top:0}
}
@media (prefers-reduced-motion:reduce){.lvr *{animation:none!important;transition:none!important}}

/* even spacing of the step rail on desktop */
@media (min-width:901px){.lv-steps{justify-content:space-between;gap:6px;padding:18px 14px}.lv-legend{margin-top:6px}}
