.pr-layer{position:fixed;inset:0;z-index:50;pointer-events:none}
.pr-focus .pr-layer,.pr-focus .pr-dock,.pr-focus .pr-cap,.pr-focus .pr-spot,.pr-focus .pr-dim,.pr-focus .pr-panel,.pr-focus .pr-welcome,.pr-focus #pr-bar,.pr-focus #pr-chip{display:none!important}
.pr-mini{display:none;position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;align-items:center;gap:8px;padding:10px 16px 10px 12px;border-radius:999px;border:1px solid var(--line);background:var(--glass);color:var(--fg);font:700 13px/1 var(--sans);cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:.75}
.pr-mini:hover{opacity:1}.pr-mini svg{width:16px;height:16px;fill:none;stroke:var(--acc-t);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pr-focus .pr-mini{display:inline-flex}
.hs{position:absolute;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:0;padding:0;background:var(--accent);color:#fff;font:800 14px/34px var(--sans);text-align:center;cursor:pointer;pointer-events:auto;box-shadow:0 6px 20px rgba(0,0,0,.35);transition:opacity .25s,scale .2s}
.hs::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--accent2);opacity:.7;animation:hspulse 2s ease-out infinite}
@keyframes hspulse{0%{transform:scale(.7);opacity:.8}100%{transform:scale(1.5);opacity:0}}
.hs:hover{scale:1.12}.hs.off{opacity:0;pointer-events:none}
.pr-notes-off .hs,.pr-touring .hs{display:none}
.pr-dim{position:fixed;inset:0;z-index:54;pointer-events:none;background:rgba(10,8,6,.66);opacity:0;transition:opacity .3s}.pr-dim.on{opacity:1}
.pr-spot{position:fixed;z-index:55;pointer-events:none;border-radius:18px;box-shadow:0 0 0 2px var(--accent2),0 0 40px color-mix(in srgb,var(--accent2) 55%,transparent);transition:opacity .3s;opacity:0}.pr-spot.on{opacity:1}
.pr-ring{position:fixed;z-index:55;pointer-events:none;border-radius:18px;box-shadow:0 0 0 2px var(--accent2),0 0 34px color-mix(in srgb,var(--accent2) 50%,transparent);opacity:0;transition:opacity .25s}.pr-ring.on{opacity:1}
.pr-cap{position:fixed;left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));transform:translate(-50%,16px);z-index:65;width:min(560px,calc(100% - 28px));padding:20px 22px 18px;border-radius:22px;background:color-mix(in srgb,var(--bg) 94%,transparent);border:1px solid var(--accent2);color:var(--fg);box-shadow:0 24px 70px rgba(0,0,0,.4);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.pr-cap.on{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.pr-cap.top{bottom:auto;top:calc(88px + env(safe-area-inset-top,0px))}
.pr-cap small{display:block;margin-bottom:6px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--acc-t)}
.pr-cap h3{margin:0 0 6px;font-size:21px;line-height:1.2;letter-spacing:-.02em;padding-right:34px}
.pr-cap p{margin:0;font-size:15px;line-height:1.55;color:var(--mut)}
.pr-cap .row{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:16px}
.pr-cap .x,.pr-panel .x{position:absolute;top:10px;right:10px;width:32px;height:32px;border:0;border-radius:50%;background:var(--card);color:var(--fg);font-size:20px;line-height:1;cursor:pointer}
.pr-b{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--fg);font:700 14px/1 var(--sans);cursor:pointer;white-space:nowrap}
.pr-b:hover{filter:brightness(1.1)}.pr-b.p{background:var(--accent);color:#fff;border-color:transparent}.pr-b:disabled{opacity:.35;cursor:default}
.pr-dots{display:flex;gap:4px;margin-right:auto;align-items:center;flex-wrap:wrap;max-width:200px}
.pr-dots i{width:6px;height:6px;border-radius:50%;background:var(--line)}.pr-dots i.on{background:var(--accent2);width:16px;border-radius:99px}
.pr-dock{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;display:flex;gap:4px;padding:6px;border-radius:999px;background:var(--glass);border:1px solid var(--line);box-shadow:0 18px 50px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.pr-dock button{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:70px;padding:8px 12px 7px;border:0;border-radius:18px;background:transparent;color:var(--fg);font:700 11px/1 var(--sans);cursor:pointer}
.pr-dock button:hover{background:var(--card)}.pr-dock button.on{background:color-mix(in srgb,var(--accent2) 24%,transparent);color:var(--acc-t)}
.pr-dock svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pr-panel{position:fixed;z-index:70;left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));transform:translate(-50%,16px);width:min(500px,calc(100% - 28px));max-height:calc(100vh - 150px);overflow:auto;padding:22px;border-radius:24px;background:color-mix(in srgb,var(--bg) 96%,transparent);border:1px solid var(--accent2);color:var(--fg);box-shadow:0 28px 80px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.pr-panel.on{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.pr-panel h3{margin:0 0 6px;font-size:21px;letter-spacing:-.02em}.pr-panel>p{margin:0 0 14px;font-size:14px;color:var(--mut);line-height:1.5}
.pr-panel h4{margin:16px 0 8px;font:800 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--acc-t)}
.pr-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pr-mode{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:14px;border:2px solid transparent;background:var(--card);color:var(--fg);font:700 14px var(--sans);cursor:pointer}
.pr-mode.on{border-color:var(--accent2)}
.pr-swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pr-sw{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 8px 10px;border-radius:16px;border:2px solid transparent;background:var(--card);color:var(--fg);font:700 12px/1.2 var(--sans);cursor:pointer}
.pr-sw.on{border-color:var(--accent2)}
.pr-sw i{display:block;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.pr-welcome{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:18px;background:rgba(10,8,6,.66);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .3s}
.pr-welcome.on{opacity:1;pointer-events:auto}
.pr-welcome .card{width:min(520px,100%);padding:30px 28px 24px;border-radius:26px;background:var(--bg);border:1px solid var(--accent2);box-shadow:0 30px 90px rgba(0,0,0,.5);text-align:center;color:var(--fg)}
.pr-welcome .ic{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 14px;border-radius:17px;background:color-mix(in srgb,var(--accent2) 22%,transparent);color:var(--acc-t)}
.pr-welcome .ic svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pr-welcome h2{margin:0 0 8px;font-size:clamp(24px,4vw,32px);line-height:1.1;letter-spacing:-.03em}
.pr-welcome p{margin:0 0 20px;color:var(--mut);font-size:15px;line-height:1.55}
.pr-welcome .col{display:grid;gap:10px}
@media (max-width:640px){
  .pr-dock{width:calc(100% - 20px);justify-content:space-between;gap:0;padding:5px}.pr-dock button{min-width:0;flex:1;padding:8px 2px 7px;font-size:10.5px}
  .pr-cap{bottom:calc(86px + env(safe-area-inset-bottom,0px));padding:16px 16px 14px}.pr-cap h3{font-size:18px}.pr-cap p{font-size:14px}
  .pr-panel{bottom:calc(86px + env(safe-area-inset-bottom,0px));padding:18px 16px}
}
@media (prefers-reduced-motion:reduce){.hs::after{animation:none}.pr-spot,.pr-dim,.pr-cap,.pr-panel{transition:none}}