.hw{
  --hw-coral:var(--accent);--hw-coral-2:#FF9A6B;--hw-blush:#F2C8B6;--hw-sun:#FFC98A;--hw-cream:var(--bg);--hw-ink:var(--ink);
  --hw-bg:var(--bg);--hw-fg:var(--ink);--hw-muted:var(--muted);--hw-panel:#FFFAF5;--hw-card:var(--card);--hw-line:var(--line);
  --hw-ok:var(--ok);--hw-printer-1:#3A3652;--hw-printer-2:#16131F;--hw-tray:#DCD0C6;--hw-route-base:#E2CBB9;--hw-blob:.42;
  --hw-display:ui-serif,Georgia,"Times New Roman",serif;
  --hw-body:ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--hw-fg);font-family:var(--hw-body);min-width:0;
}
/* Approved Phone to Paper stage, scoped to the homepage animation. */

.hw-stage{position:relative;border-radius:32px;background:var(--hw-panel);border:1px solid var(--hw-line);overflow:hidden;box-shadow:0 30px 80px -50px #1e1b2e55}
.hw-blobs i{position:absolute;width:52%;aspect-ratio:1;border-radius:50%;filter:blur(70px);opacity:var(--hw-blob);will-change:transform}
.hw-blobs i:nth-child(1){background:var(--hw-coral);left:-14%;top:-22%}
.hw-blobs i:nth-child(2){background:var(--hw-blush);right:-12%;bottom:-30%}
.hw-blobs i:nth-child(3){background:var(--hw-sun);left:38%;top:30%;width:34%;opacity:calc(var(--hw-blob) * .7)}
.hw-grain{position:absolute;inset:0;opacity:.09;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='hwNoise'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .12  0 0 0 0 .1  0 0 0 0 .18  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23hwNoise)'/></svg>")}

.hw-scene{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr) minmax(0,1.05fr);align-items:center;justify-items:center;column-gap:28px;padding:72px 40px 60px}
.hw-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:3}
.hw-station{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0;width:100%}
.hw-caption{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
.hw-caption b{font:600 13px var(--hw-body);letter-spacing:.1em;text-transform:uppercase;color:var(--hw-muted)}
.hw-caption span{font-size:13px;color:var(--hw-muted)}

/* Phone (a device surface: keeps its own light palette in both themes) */
.hw-phone{position:relative;width:min(252px,100%);aspect-ratio:9/19.4;border-radius:48px;padding:11px;
  background:linear-gradient(150deg,#56506E 0%,#1E1B2E 38%,#0E0C15 100%);
  box-shadow:inset 0 0 0 1.5px #ffffff26,0 40px 70px -30px #1e1b2e80,0 14px 26px -14px #1e1b2e66}
.hw-phone::before,.hw-phone::after{content:"";position:absolute;width:3px;border-radius:2px;background:#3A3550}
.hw-phone::before{left:-3px;top:118px;height:56px}
.hw-phone::after{right:-3px;top:150px;height:84px}
.hw-screen{position:relative;height:100%;border-radius:38px;background:#FAF6F1;color:#1E1B2E;display:flex;flex-direction:column;overflow:hidden}
.hw-island{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:86px;height:25px;border-radius:14px;background:#0A0910;z-index:2}
.hw-status{display:flex;justify-content:space-between;align-items:center;padding:14px 22px 0 26px;height:40px;font:600 12.5px var(--hw-body)}
.hw-status .hw-ic{display:flex;gap:5px;align-items:center}.hw-status svg{height:10.5px;fill:#1E1B2E}
.hw-app-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 14px 9px;border-bottom:1px solid #EFE6DD;font:600 14px var(--hw-body)}
.hw-app-bar svg{width:18px;height:18px;stroke:#1E1B2E;fill:none;stroke-width:1.8;stroke-linecap:round}
.hw-app-bar .hw-title{display:flex;gap:3px;align-items:center}.hw-app-bar .hw-title svg{width:12px;height:12px}
.hw-chat{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;padding:14px 12px 8px;font:13px/1.45 var(--hw-body)}
.hw-msg-me{align-self:flex-end;max-width:86%;background:#EFE6DC;border-radius:18px 18px 6px 18px;padding:9px 12px}
.hw-ai{display:flex;flex-direction:column;gap:9px;max-width:96%}
.hw-ai-slot{position:relative}
.hw-dots{position:absolute;left:2px;top:12px;display:inline-flex;gap:4px;opacity:0}
.hw-dots i{width:6px;height:6px;border-radius:50%;background:#BDB2C7}
.hw-chip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #ECE1D7;border-radius:13px;padding:8px 10px;box-shadow:0 3px 10px -4px #1e1b2e22}
.hw-chip > svg{width:26px;height:26px;border-radius:7px;flex-shrink:0}
.hw-chip .hw-t{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.hw-chip .hw-t b{font-size:12.5px}
.hw-chip .hw-t small{display:grid;font-size:10.5px;color:#8A8194}
.hw-chip .hw-t small span{grid-area:1/1;white-space:nowrap}
.hw-c-work{opacity:0}
.hw-state{position:relative;margin-left:auto;width:18px;height:18px;flex-shrink:0}
.hw-spin{position:absolute;inset:0;border:2px solid #F6D8CB;border-top-color:#FF6A3D;border-radius:50%;opacity:0}
.hw-tick{position:absolute;inset:0;border-radius:50%;background:#2E8B57;display:grid;place-items:center}
.hw-tick svg{width:12px;height:12px}
.hw-reply{margin:0;min-height:1.45em}
.hw-composer{margin:2px 10px 6px;display:flex;align-items:flex-end;gap:8px;background:#fff;border:1px solid #EADFD5;border-radius:22px;padding:7px 7px 7px 14px;box-shadow:0 2px 8px -4px #1e1b2e1a}
.hw-field{flex:1;min-width:0;font:13px/1.4 var(--hw-body);align-self:center;padding:3px 0}
.hw-ph{color:#A79DB0}
.hw-caret{display:inline-block;width:1.5px;height:15px;background:#FF6A3D;vertical-align:-3px;margin-left:1px}
.hw-send{width:30px;height:30px;border-radius:50%;background:#FF6A3D;display:grid;place-items:center;flex-shrink:0}
.hw-send svg{width:15px;height:15px}
.hw-home{width:112px;height:4px;border-radius:3px;background:#1E1B2E;margin:4px auto 8px;opacity:.85}

/* PrintBot hub */
.hw-hub{position:relative;width:136px;aspect-ratio:1}
.hw-hub .hw-mark{width:100%;height:100%;display:block;filter:drop-shadow(0 22px 30px #FF6A3D59)}
.hw-ring{position:absolute;inset:0;border-radius:30%;border:2px solid var(--hw-coral);opacity:0}
.hw-hub-name{font:700 24px/1 var(--hw-display);margin-top:2px}
.hw-typeset{width:min(210px,100%);background:var(--hw-card);border:1px solid var(--hw-line);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:10px;box-shadow:0 16px 36px -24px #1e1b2e66}
.hw-ts-head{display:flex;justify-content:space-between;align-items:center;font:600 11.5px var(--hw-body);color:var(--hw-muted)}
.hw-ts-state{display:grid;justify-items:end}.hw-ts-state span{grid-area:1/1;white-space:nowrap}
.hw-ts-working{opacity:0;color:var(--hw-coral)}.hw-ts-ready{color:var(--hw-ok)}
.hw-mini{background:#fff;border:1px solid #EFE4DA;border-radius:6px;padding:11px 12px;display:flex;flex-direction:column;gap:6px}
.hw-mini .hw-tl{height:8px;width:58%;background:#1E1B2E;border-radius:3px}
.hw-mini .hw-st{height:4px;width:28%;background:#FF6A3D;border-radius:2px;margin-bottom:3px}
.hw-mini .hw-row{display:flex;align-items:center;gap:6px}
.hw-mini .hw-row i{width:8px;height:8px;border:1.3px solid #1E1B2E;border-radius:2px;flex-shrink:0}
.hw-mini .hw-row b{height:4px;border-radius:2px;background:#DCCFC4}
.hw-w1{width:62%}.hw-w2{width:40%}.hw-w3{width:54%}.hw-w4{width:66%}.hw-w5{width:44%}
.hw-ts-foot{font-size:11px;color:var(--hw-muted);display:flex;justify-content:space-between}

/* Printer */
.hw-printer-wrap{width:min(320px,100%)}
#hwprinterSvg{display:block;width:100%;height:auto;overflow:visible}
.hw-svg-d{font-family:var(--hw-display)}.hw-svg-b{font-family:var(--hw-body)}
.hw-printed{display:inline-flex;align-items:center;gap:8px;background:var(--hw-card);border:1px solid var(--hw-line);border-radius:999px;padding:6px 14px 6px 6px;font:600 13px var(--hw-body);box-shadow:0 10px 24px -16px #1e1b2e66}
.hw-printed .hw-ok{width:22px;height:22px;border-radius:50%;background:var(--hw-ok);display:grid;place-items:center}
.hw-printed .hw-ok svg{width:13px;height:13px}

/* Overlay pieces */
.hw-route-base{fill:none;stroke:var(--hw-route-base);stroke-width:2;stroke-dasharray:1 9;stroke-linecap:round}
.hw-route-glow{fill:none;stroke:var(--hw-coral);stroke-width:12;stroke-linecap:round;opacity:.16}
.hw-route-line{fill:none;stroke:url(#hwrouteGrad);stroke-width:3;stroke-linecap:round}
.hw-pk,.hw-trail,#hwconfetti rect{visibility:hidden}
.hw-tag{position:absolute;z-index:4;translate:-50% -50%;display:flex;align-items:center;gap:6px;white-space:nowrap;
  font:600 11.5px var(--hw-body);color:var(--hw-fg);background:var(--hw-card);border:1px solid var(--hw-line);border-radius:999px;padding:6px 11px 6px 8px;box-shadow:0 8px 20px -12px #1e1b2e55;visibility:hidden}
.hw-tag.hw-placed{visibility:visible}
.hw-tag svg{width:13px;height:13px;fill:var(--hw-coral);color:var(--hw-coral)}

/* Chapters + controls */
.hw-chapters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.hw-chapter{appearance:none;background:none;border:0;padding:0;color:inherit;font:inherit;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:9px}
.hw-chapter.hw-ahead{opacity:.5}
.hw-chapter .hw-bar{height:3px;border-radius:2px;background:var(--hw-line);overflow:hidden}
.hw-chapter .hw-bar i{display:block;height:100%;background:var(--hw-coral);transform-origin:left;transform:scaleX(1)}
.hw-chapter b{font:600 20px var(--hw-display)}
.hw-chapter .hw-d{font-size:14px;line-height:1.5;color:var(--hw-muted)}
.hw-chapter:focus-visible,.hw-btn:focus-visible{outline:2px solid var(--hw-coral);outline-offset:6px;border-radius:6px}
.hw-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hw-btn{display:inline-flex;align-items:center;gap:8px;font:600 14px var(--hw-body);color:var(--hw-fg);background:var(--hw-panel);border:1px solid var(--hw-line);border-radius:999px;padding:9px 16px 9px 12px;cursor:pointer}
.hw-btn svg{width:16px;height:16px;fill:var(--hw-fg)}

@media (max-width:820px){
  .hw-scene{grid-template-columns:minmax(0,1fr);row-gap:118px;padding:44px 16px 52px}
  .hw-phone{width:min(252px,80%)}
  .hw-chapters{grid-template-columns:minmax(0,1fr);gap:14px}
  .hw-stage{border-radius:24px}
  }

.hw>h2,.hw-setup{color:var(--ink)}
.hw [hidden]{display:none!important}
.hw-chapters,.hw-controls{margin-top:28px}
.hw-chapter{color:var(--ink);border-radius:0}
.hw-chapter .hw-d{color:var(--muted)}
.hw-bar{width:100%}
.hw-setup{font-size:13px;margin:20px 0 0}
.hw-controls{display:none}
.hw.hw-ready .hw-controls{display:flex}
.hw-msg-me{transform-origin:100% 100%}
.hw-chip{transform-origin:0% 50%}
.hw-mark{transform-origin:50% 100%}
.hw-hub-eye{transform-box:fill-box;transform-origin:center}
.hw-mini .hw-tl,.hw-mini .hw-st{transform-origin:0% 50%}
#hwpbPage{transform-origin:160px 284px}
@media(max-width:480px){.hw{margin-inline:-4px}}