.hp-layer{position:fixed;inset:0;z-index:480;background:#07050ce6;display:flex;align-items:flex-end;justify-content:center;padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.hp-layer[hidden]{display:none}
body.hp-lock{overflow:hidden}
.hp{width:min(560px,100%);max-height:min(92vh,880px);overflow:auto;background:#161022;color:#f3efe6;border:1px solid rgba(109,40,217,.35);border-radius:20px 20px 12px 12px;padding:22px 18px 18px;box-shadow:0 18px 50px #0008}
.hp h1{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:1.35rem;line-height:1.25;margin:0 0 12px;color:#f3efe6}
.hp p{margin:0 0 10px;font-family:Inter,system-ui,sans-serif;font-weight:400;font-size:1rem;line-height:1.45;color:#f3efe6}
.hp-ai{font-size:.85rem;letter-spacing:.02em}
.hp-q13,.hp-j3,.hp-r2,.hp-r6{font-weight:600}
.hp-level{font-weight:650}
.hp-states,.hp-notions{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.hp-state,.hp-notion{display:flex;gap:10px;align-items:center;min-height:48px;background:#120c1d;border-radius:12px;padding:8px 12px;color:#f3efe6}
.hp-ico{width:1.4rem;text-align:center}
.hp-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.hp-btn{min-height:48px;min-width:48px;padding:12px 16px;border-radius:999px;border:1px solid rgba(109,40,217,.55);background:transparent;color:#f3efe6;font-family:Inter,system-ui,sans-serif;font-weight:500;font-size:1rem;line-height:1.2;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.hp-primary{background:linear-gradient(90deg,#be185d,#6d28d9);color:#f3efe6;border-color:transparent}
.hp-field{display:grid;gap:6px;font-family:Inter,system-ui,sans-serif;font-weight:500;font-size:.95rem;line-height:1.3;margin:8px 0 12px;color:#a59d91}
.hp-field input,.hp-field textarea{min-height:48px;font-family:Inter,system-ui,sans-serif;font-weight:400;font-size:1.05rem;line-height:1.3;padding:10px 12px;border-radius:12px;border:1px solid rgba(109,40,217,.55);background:#07050c;color:#f3efe6}
.hp-field textarea{min-height:96px}
.hp-code{font-weight:500;font-size:.95rem;line-height:1.45;font-family:ui-monospace,monospace;word-break:break-word;background:#07050c;color:#f3efe6;padding:12px;border-radius:12px}
.hp-qr{display:flex;justify-content:center;background:#fff;border-radius:12px;padding:16px;margin:8px 0 12px}
.hp-qr svg{width:min(300px,78vw);height:auto;display:block;background:#fff}
@media (min-width:1100px){.hp-qr svg{width:420px}}
a.hp-textlink{color:var(--ink);text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}
html[data-reading="comfort"] a.hp-textlink{color:#1f1a2b!important;-webkit-text-fill-color:#1f1a2b!important;text-decoration:underline!important}
.hp-cam{width:100%;max-height:42vh;background:#111;border-radius:12px;margin:8px 0 12px}
.hp-badge{display:inline-block;background:#6d28d9;color:#f3efe6;border-radius:999px;padding:2px 8px;font-size:.8rem}
@media (min-width:800px){
  .hp-layer{align-items:center}
  .hp{border-radius:20px;padding:28px}
}
html[data-reading="comfort"] .hp,
html[data-reading="comfort"] .hp-state,
html[data-reading="comfort"] .hp-notion,
html[data-reading="comfort"] .hp-field input,
html[data-reading="comfort"] .hp-field textarea,
html[data-reading="comfort"] .hp-code{
  background:#fff!important;
  background-image:none!important;
  color:#1f1a2b!important;
  -webkit-text-fill-color:#1f1a2b!important;
}
html[data-reading="comfort"] .hp h1,
html[data-reading="comfort"] .hp p,
html[data-reading="comfort"] .hp-btn,
html[data-reading="comfort"] .hp-field,
html[data-reading="comfort"] .hp-ai{
  color:#1f1a2b!important;
  -webkit-text-fill-color:#1f1a2b!important;
}
html[data-reading="comfort"] .hp-primary,
html[data-reading="comfort"] .hp-badge{
  background:#6d28d9!important;
  background-image:none!important;
  color:#f7f3e8!important;
  -webkit-text-fill-color:#f7f3e8!important;
}
