.hw-st{position:relative;min-height:420px;border-radius:var(--r-xl);background:#f1e6cf;overflow:hidden;--cy: 7s}.hw-st:after{content:"";position:absolute;left:0;right:0;bottom:0;height:80px;background:#e8dac0;z-index:0}.hw-st-tag{position:absolute;left:32px;top:28px;max-width:240px;z-index:1}.hw-st-tag b{display:block;font:400 22px/1.15 var(--f-display);letter-spacing:-.01em;color:var(--ink)}.hw-st-tag span{display:block;margin-top:6px;font:400 14px/20px var(--f-sans);color:#4a4740}.hw-st-bot{position:absolute;left:56px;bottom:56px;width:140px;aspect-ratio:230 / 262;z-index:1;line-height:0}.hw-st-bot svg{width:100%;height:100%;overflow:visible}.hw-st-bot .happy,.hw-st-bot .grin,.hw-st-bot .done-line{opacity:0}.hw-st-bot .all,.hw-st-bot .upper,.hw-st-bot .eyes,.hw-st-bot .arm-r{transform-box:fill-box}.hw-st-bot .all{transform-origin:50% 100%;animation:hwHop var(--cy) infinite}.hw-st-bot .upper{transform-origin:50% 90%;animation:hwBreathe 3.2s ease-in-out infinite}.hw-st-bot .eyes.open{transform-origin:50% 50%;animation:hwOpen var(--cy) infinite}.hw-st-bot .happy,.hw-st-bot .grin,.hw-st-bot .done-line{animation:hwOn var(--cy) infinite}.hw-st-bot .smile,.hw-st-bot .todo{animation:hwOff var(--cy) infinite}.hw-st-bot .arm-r{transform-origin:10% 20%;animation:hwWave var(--cy) infinite}.hw-st-desk{position:absolute;right:28px;top:28px;width:min(380px,calc(100% - 270px));background:var(--surface);border-radius:var(--r-lg);padding:20px;z-index:1}.hw-st-dh{display:flex;justify-content:space-between;align-items:center;font:500 12px/16px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.hw-st-count{position:relative;display:inline-grid;background:var(--ink);color:#fff;border-radius:99px;padding:3px 9px}.hw-st-count>span,.hw-st-pill>span{grid-area:1 / 1}.hw-st-count .c1,.hw-st-pill .p-draft{animation:hwOff var(--cy) infinite}.hw-st-count .c0,.hw-st-pill .p-ok{opacity:0;animation:hwOn var(--cy) infinite}.hw-st-card{margin-top:14px;border-radius:var(--r-md);background:var(--bg);padding:16px;animation:hwCard var(--cy) cubic-bezier(.23,1,.32,1) infinite}.hw-st-from{display:flex;align-items:center;gap:10px;font:600 14px/20px var(--f-sans)}.hw-st-from i{width:12px;height:12px;border-radius:4px;flex:none;background:#d4471e}.hw-st-pill{margin-left:auto;display:inline-grid;justify-items:center;font:500 11px/14px var(--f-mono);padding:4px 9px;border-radius:99px;background:var(--tile);color:var(--muted);animation:hwPill var(--cy) infinite}.hw-st-title{margin:10px 0 8px;font:400 16px/1.35 var(--f-sans);color:var(--ink)}.hw-st-l{height:7px;border-radius:4px;background:var(--tile);margin:7px 0}.hw-st-prog{position:relative;height:4px;margin-top:16px;border-radius:2px;background:var(--tile);overflow:hidden}.hw-st-prog:after{content:"";position:absolute;inset:0;background:var(--accent);transform-origin:left;transform:scaleX(1);animation:hwProg var(--cy) linear infinite}.hw-st-log{margin-top:12px;display:flex;gap:6px;min-height:26px}.hw-st-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:99px;background:var(--tile);font:500 11px/14px var(--f-mono);opacity:0;animation:hwChip var(--cy) infinite}.hw-st-chip i{width:8px;height:8px;border-radius:3px;background:#d4471e}.hw-st-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}.hw-st-pause{position:absolute;right:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:44px;padding:0 14px;border-radius:99px;background:var(--surface);color:var(--ink);font:600 13px/1 var(--f-sans);cursor:pointer}.hw-st-pause input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}.hw-st-pause:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.hw-st-pause .off,.hw-st-pause:has(input:checked) .on{display:none}.hw-st-pause:has(input:checked) .off{display:inline}.hw-st:has(.hw-st-pause input:checked) *{animation:none!important}.hw-st:has(.hw-st-pause input:checked) .hw-st-card{opacity:1;transform:none}.hw-st:has(.hw-st-pause input:checked) .hw-st-chip,.hw-st:has(.hw-st-pause input:checked) .p-ok,.hw-st:has(.hw-st-pause input:checked) .c0{opacity:1}.hw-st:has(.hw-st-pause input:checked) .p-draft,.hw-st:has(.hw-st-pause input:checked) .c1{opacity:0}.hw-st:has(.hw-st-pause input:checked) .hw-st-pill{background:var(--accent-text);color:#fff}@keyframes hwCard{0%{transform:translate(-48px) scale(.92);opacity:0}7%,62%{transform:none;opacity:1}72%,to{transform:translate(320px) rotate(8deg);opacity:0}}@keyframes hwProg{0%{transform:scaleX(0)}33%,to{transform:scaleX(1)}}@keyframes hwPill{0%,33%{background:var(--tile);color:var(--muted)}34%,72%{background:var(--accent-text);color:#fff}73%,to{background:var(--tile);color:var(--muted)}}@keyframes hwOn{0%,33%{opacity:0}34%,72%{opacity:1}73%,to{opacity:0}}@keyframes hwOff{0%,33%{opacity:1}34%,72%{opacity:0}73%,to{opacity:1}}@keyframes hwOpen{0%,33%{opacity:1}34%,72%{opacity:0}73%,to{opacity:1}}@keyframes hwHop{0%,34%{transform:none}38%{transform:scale(1.05,.94)}44%{transform:translateY(-16px) scale(.97,1.04)}50%{transform:scale(1.03,.97)}54%,to{transform:none}}@keyframes hwWave{0%,36%{transform:none}42%{transform:rotate(-38deg)}48%{transform:rotate(-8deg)}54%{transform:rotate(-38deg)}60%,to{transform:none}}@keyframes hwChip{0%,68%{opacity:0}72%,96%{opacity:1}to{opacity:0}}@keyframes hwBreathe{50%{transform:translateY(2.5px) scaleY(.985)}}@media(max-width:720px){.hw-st{min-height:652px}.hw-st-tag{left:20px;top:20px;right:20px;max-width:none}.hw-st-bot{left:50%;margin-left:-50px;top:104px;bottom:auto;width:100px}.hw-st-desk{inset:auto 16px 72px;width:auto}}@media(prefers-reduced-motion:reduce){.hw-st *,.hw-st *:before{animation:none!important}.hw-st-card{opacity:1;transform:none}.hw-st-chip,.hw-st .p-ok,.hw-st .c0{opacity:1}.hw-st .p-draft,.hw-st .c1{opacity:0}.hw-st-pill{background:var(--accent-text);color:#fff}.hw-st-pause{display:none}}.hw-st.hero{min-height:460px}@media(max-width:860px){.hw-st.hero{min-height:612px}}