/* Helping Hand Therapy book viewer, opened from the top-right notebook. transform / opacity only. */
#hhb{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;visibility:hidden;
  background:radial-gradient(120% 90% at 50% 40%,rgba(14,16,40,.72),rgba(6,8,22,.9));--pw:min(44vw,calc((100vh - 210px) * 1.3333),780px);color:#EDE8DB;font-family:var(--ps-font),system-ui,sans-serif}
#hhb.on{visibility:visible;opacity:1}
#hhb[hidden]{display:none}
#hhb .hb-stage{position:relative;width:calc(var(--pw) * 2);height:calc(var(--pw) * .75);perspective:2600px;transform-style:preserve-3d;will-change:transform}
#hhb .hb-board{position:absolute;inset:-16px -18px -18px;border-radius:10px 14px 14px 10px;background:linear-gradient(135deg,#0c1260,#070B43 55%,#04062a);
  box-shadow:0 2px 0 rgba(255,255,255,.07) inset,0 40px 80px -20px rgba(2,3,20,.8),0 14px 30px -10px rgba(2,3,20,.6)}
#hhb .hb-pg{position:absolute;top:0;width:var(--pw);height:100%;overflow:hidden;background:#ECE8DF;backface-visibility:hidden}
#hhb .hb-l{left:0;border-radius:4px 0 0 4px}
#hhb .hb-r{left:50%;border-radius:0 4px 4px 0}
#hhb .hb-pg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,0) 78%,rgba(0,0,0,.16))}
#hhb .hb-r::after,#hhb .hb-leaf .hb-front::after{background:linear-gradient(270deg,rgba(0,0,0,0) 78%,rgba(0,0,0,.16))}
#hhb .hb-pg img{position:absolute;inset:3.5%;width:93%;height:93%;object-fit:contain;display:block;user-select:none;-webkit-user-drag:none}
#hhb .hb-pg.full img{inset:0;width:100%;height:100%;object-fit:cover}
#hhb .hb-card{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:9%;gap:0;background:var(--ps-bg);color:var(--ps-tp)}
#hhb .hb-card i{order:1;margin:0 0 14px;font:400 10px/1.5 var(--ps-font);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--ps-accent-ink);opacity:1}
#hhb .hb-card b{order:2;align-self:stretch;margin:0 0 22px;padding:0 0 14px;border-bottom:1px solid var(--ps-rule);font:300 clamp(24px,3.2vw,40px)/1.02 var(--ps-font);letter-spacing:-.03em}
#hhb .hb-card a{order:3;position:relative;padding:10px 14px;border:1px solid var(--ps-tp);border-radius:999px;background:var(--ps-tp);color:var(--ps-bg);font:500 10px/1 var(--ps-font);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  transition:transform .3s cubic-bezier(.3,1.5,.5,1),border-color .2s linear,background-color .2s linear,color .2s linear}
#hhb .hb-card a:hover{transform:translateY(-1px);background:var(--ps-accent);border-color:var(--ps-accent)}
#hhb .hb-card a:active{transform:scale(.96)}
#hhb .hb-cover{position:absolute;inset:0;background:#070B43}
#hhb .hb-pg .hb-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
#hhb .hb-blank{position:absolute;inset:0;background:#E6E2D9}
#hhb .hb-spine{position:absolute;left:50%;top:0;bottom:0;width:36px;margin-left:-18px;pointer-events:none;z-index:6;background:linear-gradient(90deg,rgba(0,0,0,0),rgba(0,0,0,.22) 50%,rgba(0,0,0,0))}
#hhb .hb-leaf{position:absolute;left:50%;top:0;width:var(--pw);height:100%;transform-origin:0 50%;transform-style:preserve-3d;z-index:5;will-change:transform}
#hhb .hb-leaf .hb-pg{left:0}
#hhb .hb-leaf .hb-back{transform:rotateY(180deg)}
#hhb .hb-shade{position:absolute;top:0;width:var(--pw);height:100%;pointer-events:none;z-index:4;background:linear-gradient(90deg,rgba(0,0,0,.35),rgba(0,0,0,0) 70%);opacity:0}
#hhb .hb-ctr{margin-top:34px;padding:12px 14px 12px 20px;border:1px solid var(--ps-rule);border-radius:4px;background:var(--ps-bg);color:var(--ps-ts);box-shadow:var(--ps-shadow);font:400 10px/1 var(--ps-font);letter-spacing:.12em;text-transform:uppercase;display:flex;gap:22px;align-items:center}
#hhb .hb-ctr a{position:relative;padding:10px 14px;border:1px solid var(--ps-tp);border-radius:999px;background:var(--ps-tp);color:var(--ps-bg);font-weight:500;text-decoration:none;transition:transform .3s cubic-bezier(.3,1.5,.5,1),border-color .2s linear,background-color .2s linear}
#hhb .hb-ctr a:hover{transform:translateY(-1px);background:var(--ps-accent);border-color:var(--ps-accent)}
#hhb .hb-ctr a:active{transform:scale(.96)}
#hhb .hb-ctr a::after,#hhb .hb-card a::after{content:'';position:absolute;left:-2px;right:-2px;top:50%;height:44px;transform:translateY(-50%)}
#hhb button,#hhb .hb-ctr a{cursor:pointer}
#hhb .hb-nav,#hhb .hb-x{position:absolute;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1px solid var(--ps-rule);background:var(--ps-bg);color:var(--ps-tp);padding:0;transition:transform .3s cubic-bezier(.3,1.4,.5,1),opacity .25s,border-color .2s linear}
#hhb .hb-nav svg,#hhb .hb-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#hhb .hb-nav:hover,#hhb .hb-x:hover{transform:translateY(-1px);border-color:var(--ps-accent)}
#hhb .hb-nav:active,#hhb .hb-x:active{transform:scale(.94)}
#hhb .hb-nav:focus-visible,#hhb .hb-x:focus-visible,#hhb .hb-ctr a:focus-visible,#hhb .hb-card a:focus-visible{outline:1.5px solid var(--ps-accent);outline-offset:2px}
#hhb .hb-nav[disabled]{opacity:.25;pointer-events:none}
#hhb .hb-prev{left:max(16px,calc(50vw - var(--pw) - 86px));top:50%;margin-top:-23px}
#hhb .hb-next{right:max(16px,calc(50vw - var(--pw) - 86px));top:50%;margin-top:-23px}
#hhb .hb-x{top:22px;right:22px}
#hhb.hb-one{--pw:min(92vw,calc((100vh - 190px) * 1.3333))}
#hhb.hb-one .hb-stage{width:var(--pw)}
#hhb.hb-one .hb-board{inset:-10px}
#hhb.hb-one .hb-prev{left:10px;top:auto;bottom:22px;margin:0}
#hhb.hb-one .hb-next{right:10px;top:auto;bottom:22px;margin:0}
#hhb.hb-one .hb-pg,#hhb.hb-one .hb-r{left:0;border-radius:4px}
#hhb.hb-one .hb-pg::after,#hhb.hb-one .hb-spine{display:none}
#hhb.hb-one .hb-ctr{margin-top:70px}
#hhb.hb-one .hb-x{top:14px;right:14px}
/* short landscape phones: bigger spread, chrome tucked to the sides */
@media (max-height:520px) and (min-aspect-ratio:1/1) and (min-width:761px){
  #hhb:not(.hb-one){--pw:min(41vw,calc((100vh - 96px) * 1.3333))}
  #hhb:not(.hb-one) .hb-ctr{margin-top:26px}
  #hhb:not(.hb-one) .hb-prev{left:max(8px,calc(50vw - var(--pw) - 62px))}
  #hhb:not(.hb-one) .hb-next{right:max(8px,calc(50vw - var(--pw) - 62px))}
  #hhb:not(.hb-one) .hb-x{top:10px;right:10px}
}

/* closed book: only the cover shows, centred; the spread opens as the first leaf turns */
#hhb .hb-stage{translate:0 0;transition:translate .6s cubic-bezier(.45,.05,.2,1)}
#hhb.hb-closed .hb-stage{translate:calc(var(--pw) * -.5) 0}
#hhb.hb-closed .hb-l,#hhb.hb-closed .hb-spine,#hhb.hb-closed .hb-shade{visibility:hidden}
#hhb.hb-closed .hb-board{inset:-16px -18px -18px calc(50% - 8px);border-radius:6px 14px 14px 6px}
#hhb.hb-closing .hb-stage{translate:calc(var(--pw) * -.5) 0}
@media (prefers-reduced-motion:reduce){#hhb .hb-stage{transition:none}}