/* The Design Gallery's viewer (desk P38), added around a look by tools/gallery.py. The look's own CSS never sees these names. */
@font-face{font-family:"PR Viewer";font-weight:600;font-display:swap;src:url(fonts/space-grotesk-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"PR Viewer";font-weight:700;font-display:swap;src:url(fonts/space-grotesk-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"PR Viewer Text";font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format("woff2")}
.gv-bar{position:fixed;left:0;right:0;top:0;z-index:1000;display:flex;align-items:center;gap:10px;height:52px;padding:0 14px;background:rgba(5,7,26,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(120,140,255,.25);font:14px/1 Inter,system-ui,sans-serif;color:#F4F6FF}
.gv-bar a,.gv-bar button{color:#F4F6FF;text-decoration:none;font:600 13.5px "PR Viewer",system-ui,sans-serif;background:none;border:1px solid rgba(167,176,214,.45);border-radius:999px;padding:7px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.gv-bar a:hover,.gv-bar button:hover{border-color:#43C6F0}
.gv-bar :focus-visible{outline:3px solid #43C6F0;outline-offset:2px}
.gv-id{display:flex;align-items:baseline;gap:10px;margin:0 auto;min-width:0}
.gv-id b{font:600 12px "PR Viewer",system-ui,sans-serif;letter-spacing:.18em;color:#43C6F0}
.gv-id > span{font:600 15px "PR Viewer",system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gv-id i{font:400 13px "PR Viewer Text",system-ui,sans-serif;font-style:normal;color:#A7B0D6;font-size:13px;white-space:nowrap}
.gv-bar .gv-talk{background:#E0399A;border-color:#E0399A;color:#05071a}
.gv-pad{height:52px}
.gv-phone[hidden]{display:none}
.gv-dialog{border:0;padding:0;background:transparent;max-height:none}
.gv-dialog::backdrop{background:rgba(5,7,26,.85)}
.gv-frame{box-sizing:content-box;width:390px;height:min(844px,86vh);border:12px solid #111;border-radius:44px;background:#fff;display:block}
.gv-dialog form{text-align:center;margin-top:10px}
.gv-dialog button{font:600 14px "PR Viewer",system-ui,sans-serif;background:#F4F6FF;color:#05071a;border:0;border-radius:999px;padding:9px 18px;cursor:pointer}
/* phone: two chips, the look full screen */
.gv-chips{display:none}
@media (max-width:640px){
  .gv-bar,.gv-pad{display:none}
  .gv-chips{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:1000;justify-content:space-between;align-items:flex-end;pointer-events:none}
  .gv-chips>*{pointer-events:auto}
  .gv-chip{font:600 13px "PR Viewer",system-ui,sans-serif;color:#F4F6FF;background:rgba(5,7,26,.88);border:1px solid rgba(167,176,214,.5);border-radius:999px;padding:9px 14px;text-decoration:none;backdrop-filter:blur(6px)}
  .gv-chip.gv-talk{background:#E0399A;border-color:#E0399A;color:#05071a}
  .gv-info summary{list-style:none;cursor:pointer}
  .gv-info summary::-webkit-details-marker{display:none}
  .gv-info[open] .gv-panel{display:block}
  .gv-panel{display:none;position:absolute;left:0;right:0;bottom:52px;background:rgba(5,7,26,.95);border:1px solid rgba(120,140,255,.3);border-radius:18px;padding:16px;color:#F4F6FF;font:14px/1.45 Inter,system-ui,sans-serif}
  .gv-panel__name{font:700 18px "PR Viewer",system-ui,sans-serif;margin:0 0 2px}
  .gv-panel p:not(.gv-panel__name){margin:0 0 10px;color:#A7B0D6}
  .gv-panel nav{display:flex;justify-content:space-between;gap:10px}
  .gv-panel nav a{flex:1;text-align:center;color:#F4F6FF;text-decoration:none;border:1px solid rgba(167,176,214,.5);border-radius:999px;padding:9px 0;font:600 14px "PR Viewer",system-ui,sans-serif}
  .gv-info{position:static}
}
@media (prefers-reduced-motion:reduce){.gv-bar *{transition:none}}

.gv-framed .gv-hint,.gv-framed dialog{display:none}
.gv-hint{position:fixed;left:50%;bottom:70px;transform:translateX(-50%);z-index:1000;margin:0;padding:8px 16px;border-radius:999px;background:rgba(5,7,26,.92);color:#F4F6FF;border:1px dashed rgba(67,198,240,.6);font:600 14px "PR Viewer",system-ui,sans-serif;white-space:nowrap}
.gv-hint[hidden]{display:none}