/* 보건플레이랩 by JH Studio — isolated additions only. No game style overrides. */
/* Place within the existing 16:9 opening-stage; avoid left character and center resume button. */
.jh-brand-home {
  position:absolute; right:1.6%; bottom:1.8%; z-index:9;
  display:flex; flex-direction:column; align-items:flex-end; gap:3px;
  max-width:29%; pointer-events:none;
}
.jh-brand-home img {
  display:block; width:clamp(108px, 15cqw, 182px); max-width:100%; height:auto;
  object-fit:contain; pointer-events:none;
}
.jh-brand-home .jh-info {
  pointer-events:auto; touch-action:manipulation;
  display:inline-flex; align-items:center; justify-content:center;
  font:600 clamp(10px, 1.06cqw, 12px)/1.15 system-ui,'Noto Sans KR',sans-serif;
  border:1px solid #d5c7ef; border-radius:50px;
  background:rgba(255,255,255,.96); color:#29225c;
  padding:5px 9px; min-height:25px; cursor:pointer; white-space:nowrap;
  box-shadow:0 2px 7px rgba(19,22,60,.18);
}
.jh-brand-home .jh-info:focus-visible,
.jh-brand-dialog .jh-close:focus-visible {outline:3px solid #8254ea;outline-offset:2px}
/* Non-interactive micro-signature; never catches touches/clicks. */
.jh-brand-game {
  position:fixed; right:max(7px,env(safe-area-inset-right));
  bottom:max(4px,env(safe-area-inset-bottom)); z-index:30;
  color:rgba(230,238,251,.65);
  font:500 10px/1.2 system-ui,'Noto Sans KR',sans-serif;
  text-shadow:0 1px 3px rgba(9,22,39,.85);
  pointer-events:none; user-select:none; white-space:nowrap;
}
/* Overlay is mounted directly to <body>, not within clipped 16:9 stage. */
.jh-brand-overlay {
  position:fixed; inset:0; z-index:100000;
  display:none; align-items:center; justify-content:center;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right))
          max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  background:rgba(15,12,43,.62);
  -webkit-overflow-scrolling:touch;
}
.jh-brand-overlay.open {display:flex}
.jh-brand-dialog {
  position:relative; box-sizing:border-box;
  width:min(94vw,640px); max-height:min(90dvh,90vh); overflow-y:auto;
  margin:0; padding:clamp(19px,3vw,29px) clamp(14px,3vw,29px) 21px;
  border:5px solid #cbb4fa; border-radius:24px;
  box-shadow:0 14px 0 #986ed1,0 24px 54px rgba(12,9,44,.4);
  background:#fff; color:#11143e; text-align:center;
  font:500 clamp(13px, 1.5vw, 17px)/1.65 system-ui,'Noto Sans KR',sans-serif;
  word-break:keep-all;
}
.jh-brand-dialog .jh-popup-logo {display:block;width:min(80%,340px);height:auto;margin:0 auto 13px}
.jh-brand-dialog h2 {
  display:table; max-width:100%; margin:0 auto 16px;
  border-radius:50px; padding:5px clamp(14px,4vw,34px);
  background:#e2cdfd; color:#191147;
  font-size:clamp(17px,2.5vw,25px);font-weight:850; line-height:1.45;
}
.jh-brand-dialog p {margin:0 auto 16px;max-width:540px;font-size:inherit;line-height:1.7}
.jh-brand-dialog .jh-warning {
  margin:0 auto 15px; max-width:555px;
  display:flex; align-items:center; gap:12px;
  padding:clamp(10px,2vw,18px); border-radius:20px;
  background:#ffe6ed; font-weight:750; text-align:left;
}
.jh-brand-dialog .jh-warning-symbol {
  flex:none;display:grid;place-items:center;
  width:56px;height:56px;border-radius:50%;
  border:5px solid #f22863;color:#ec1655;
  background:#fff;font-size:27px;font-weight:900;line-height:1;
}
.jh-brand-dialog .jh-copyright {display:block;font-size:clamp(12px,1.55vw,17px);font-weight:700}
.jh-brand-dialog .jh-close {
  position:sticky; float:right; top:0; z-index:1;
  width:42px;height:42px;padding:0;border:0;border-radius:10px;
  background:#fff;color:#23165f;font:40px/1 system-ui,sans-serif;
  cursor:pointer;touch-action:manipulation;
}
@media (max-width:560px) {
 .jh-brand-home {right:1.5%;bottom:1%;gap:2px}
 .jh-brand-home img {width:clamp(90px,15cqw,140px)}
 .jh-brand-home .jh-info {font-size:10px;padding:3px 6px;min-height:21px}
 .jh-brand-dialog {border-width:3px;border-radius:17px;padding:14px 12px 17px}
 .jh-brand-dialog .jh-popup-logo {max-width:230px;margin-bottom:8px}
 .jh-brand-dialog p {margin-bottom:10px}
 .jh-brand-dialog .jh-warning {gap:8px}
 .jh-brand-dialog .jh-warning-symbol {width:40px;height:40px;font-size:20px;border-width:3px}
 .jh-brand-dialog .jh-close {width:34px;height:34px;font-size:30px}
}