*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--pd-preview-bg)}button,a{font:inherit}.pd-toolbar{position:fixed;z-index:999999;left:0;right:0;height:var(--pd-toolbar-height);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;padding:0 14px;background:var(--pd-toolbar-bg);border-color:var(--pd-toolbar-border);color:var(--pd-toolbar-text);font-size:var(--pd-toolbar-font-size);box-shadow:0 2px 12px rgba(0,0,0,.15)}.pd-toolbar-top .pd-toolbar{top:0;border-bottom:1px solid var(--pd-toolbar-border)}.pd-toolbar-bottom .pd-toolbar{bottom:0;border-top:1px solid var(--pd-toolbar-border)}.pd-toolbar-left,.pd-toolbar-center,.pd-toolbar-right{display:flex;align-items:center;gap:8px;min-width:0}.pd-toolbar-center{justify-content:center}.pd-toolbar-right{justify-content:flex-end}.pd-brand-block{display:flex;align-items:center;gap:8px;min-width:0;height:calc(var(--pd-toolbar-height) - 14px);padding:4px 11px 4px 7px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:calc(var(--pd-button-radius) + 2px);box-shadow:0 1px 3px rgba(15,23,42,.08)}.pd-brand-logo{width:38px;height:38px;display:grid;place-items:center}.pd-brand-logo img{max-width:100%;max-height:100%;object-fit:contain}.pd-brand-name{color:#5b5ce2;text-decoration:none;font-weight:800;white-space:nowrap;background:linear-gradient(90deg,#2563eb 0%,#7c3aed 58%,#9333ea 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.pd-preview-name{padding-left:10px;border-left:1px solid color-mix(in srgb,var(--pd-toolbar-text) 20%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.82}.pd-icon-btn,.pd-device,.pd-close,.pd-secondary{min-width:44px;min-height:44px;border:0;border-radius:var(--pd-button-radius);background:transparent;color:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;text-decoration:none}.pd-device{padding:0 11px}.pd-device:hover,.pd-device.is-active,.pd-icon-btn:hover,.pd-close:hover{background:rgba(255,255,255,.11)}.pd-device.is-active{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}.pd-cta{min-height:44px;display:inline-flex;align-items:center;padding:0 17px;border-radius:var(--pd-button-radius);background:var(--pd-cta-bg);color:var(--pd-cta-text);font-weight:700;text-decoration:none;white-space:nowrap}.pd-close{font-size:28px}.pd-device-cycle{display:none;min-width:44px;min-height:44px;border:0;border-radius:var(--pd-button-radius);background:transparent;color:inherit;cursor:pointer}.pd-toolbar button:focus-visible,.pd-toolbar a:focus-visible,.pd-secondary:focus-visible{outline:3px solid #60a5fa;outline-offset:2px}.pd-stage{position:absolute;inset:0;background:var(--pd-preview-bg);display:flex;align-items:stretch;justify-content:center;overflow:hidden}.pd-toolbar-top .pd-stage{top:var(--pd-toolbar-height)}.pd-toolbar-bottom .pd-stage{bottom:var(--pd-toolbar-height)}.pd-frame-wrap{height:100%;width:100%;margin:0 auto;background:#fff;transition:width .18s ease,max-width .18s ease;box-shadow:0 0 0 1px rgba(0,0,0,.08)}.pd-frame-wrap.is-desktop{width:100%!important;max-width:var(--pd-desktop,100%);min-width:0}.pd-frame-wrap.is-tablet{width:min(var(--pd-tablet),100%)}.pd-frame-wrap.is-mobile{width:min(var(--pd-mobile),100%)}#pd-frame{display:block;width:100%;height:100%;border:0;background:#fff}.pd-loader,.pd-load-error{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#f8fafc;color:#111827;text-align:center;padding:30px}.pd-loader small{color:#6b7280}.pd-spinner{width:36px;height:36px;border:3px solid #d1d5db;border-top-color:#111827;border-radius:50%;animation:pd-spin .8s linear infinite}@keyframes pd-spin{to{transform:rotate(360deg)}}.pd-loader[hidden],.pd-load-error[hidden]{display:none!important}.pd-secondary{background:#111827;color:#fff;padding:0 16px;margin-top:8px}@media(max-width:760px){.pd-toolbar{grid-template-columns:1fr auto;padding:0 8px;gap:5px}.pd-toolbar-center{order:3;position:absolute;left:50%;transform:translateX(-50%)}.pd-brand-name,.pd-preview-name,.pd-device span{display:none}.pd-toolbar-left,.pd-toolbar-right{gap:3px}.pd-brand-logo{width:34px;height:34px}.pd-cta{padding:0 12px}.pd-device{padding:0;min-width:44px}}@media(max-width:470px){.pd-toolbar-center .pd-device,.pd-toolbar-center [data-pd-action="refresh"]{display:none}.pd-device-cycle{display:inline-flex;align-items:center;justify-content:center}.pd-toolbar-right [data-pd-action="fullscreen"]{display:none}.pd-brand-logo{display:none}.pd-cta{width:44px;padding:0;font-size:0;justify-content:center}.pd-cta:after{content:'↗';font-size:18px}.pd-cta{overflow:hidden;text-overflow:ellipsis}}

/* v1.2.0 responsive device selector */
.pd-device-glyph{position:relative;display:inline-block;flex:0 0 auto;color:currentColor}.pd-glyph-desktop{width:18px;height:12px;border:1.7px solid currentColor;border-radius:2px}.pd-glyph-desktop:before{content:"";position:absolute;left:50%;bottom:-5px;width:2px;height:4px;background:currentColor;transform:translateX(-50%)}.pd-glyph-desktop:after{content:"";position:absolute;left:50%;bottom:-6px;width:9px;height:1.7px;background:currentColor;border-radius:2px;transform:translateX(-50%)}.pd-glyph-tablet{width:12px;height:17px;border:1.7px solid currentColor;border-radius:2.5px}.pd-glyph-tablet:after{content:"";position:absolute;left:50%;bottom:1px;width:2px;height:2px;background:currentColor;border-radius:50%;transform:translateX(-50%)}.pd-glyph-mobile{width:9px;height:17px;border:1.7px solid currentColor;border-radius:2.5px}.pd-glyph-mobile:after{content:"";position:absolute;left:50%;bottom:1px;width:1.8px;height:1.8px;background:currentColor;border-radius:50%;transform:translateX(-50%)}.pd-device-picker{display:none;position:relative}.pd-device-picker-toggle{min-height:44px;border:0;border-radius:var(--pd-button-radius);background:rgba(255,255,255,.08);color:inherit;display:flex;align-items:center;gap:8px;padding:0 10px;cursor:pointer}.pd-device-picker-toggle:hover,.pd-device-picker-toggle[aria-expanded="true"]{background:rgba(255,255,255,.14)}.pd-picker-label{font-weight:600;font-size:12px}.pd-picker-chevron{font-size:15px;line-height:1;opacity:.75}.pd-device-picker-menu{position:absolute;z-index:1000000;top:calc(100% + 8px);left:50%;transform:translateX(-50%);min-width:156px;padding:6px;background:var(--pd-toolbar-bg);color:var(--pd-toolbar-text);border:1px solid var(--pd-toolbar-border);border-radius:12px;box-shadow:0 14px 34px rgba(0,0,0,.24)}.pd-toolbar-bottom .pd-device-picker-menu{top:auto;bottom:calc(100% + 8px)}.pd-device-picker-menu[hidden]{display:none!important}.pd-device-option{width:100%;min-height:42px;border:0;border-radius:8px;background:transparent;color:inherit;display:flex;align-items:center;gap:11px;padding:0 11px;cursor:pointer;text-align:left}.pd-device-option:hover,.pd-device-option.is-active{background:rgba(255,255,255,.11)}.pd-device-option.is-active{font-weight:700}.pd-device-option .pd-device-glyph{margin-left:2px}.pd-device-picker-toggle:focus-visible,.pd-device-option:focus-visible{outline:3px solid #60a5fa;outline-offset:2px}
@media(max-width:470px){.pd-device-picker{display:block}.pd-device-cycle{display:none!important}.pd-brand-logo{display:grid;width:30px;height:30px}.pd-cta{width:auto;min-width:72px;padding:0 10px;font-size:12px;justify-content:center}.pd-cta:after{display:none}.pd-toolbar-center{z-index:3}.pd-toolbar-right{position:relative;z-index:4}.pd-toolbar-left{position:relative;z-index:4}}
@media(max-width:760px){.pd-device .pd-device-glyph{display:inline-block}}
@media(max-width:350px){.pd-brand-block{display:none}.pd-picker-label,.pd-picker-chevron{display:none}.pd-device-picker-toggle{width:44px;padding:0;justify-content:center}.pd-brand-logo{display:none}}

/* v1.2.1 branding card */
@media(max-width:760px){.pd-brand-block{height:calc(var(--pd-toolbar-height) - 12px);padding:3px 6px;gap:4px}}

/* v1.2.2 true device viewport simulation */
.pd-device-canvas{position:relative;height:100%;flex:0 0 auto;overflow:hidden;margin:0 auto;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.pd-device-canvas .pd-frame-wrap{position:absolute;top:0;left:0;margin:0;min-width:0;max-width:none!important;transform-origin:top left;box-shadow:none;transition:transform .18s ease,width .18s ease,height .18s ease}
.pd-device-canvas .pd-frame-wrap.is-desktop,.pd-device-canvas .pd-frame-wrap.is-tablet,.pd-device-canvas .pd-frame-wrap.is-mobile{width:var(--pd-viewport-width,100%)!important;max-width:none!important}
.pd-device-canvas #pd-frame{width:100%;height:100%}
/* v1.2.3 mobile selector tap-area fix */
@media(max-width:470px){
  .pd-toolbar{grid-template-columns:auto minmax(44px,1fr) auto;column-gap:4px;overflow:visible}
  .pd-toolbar-left{grid-column:1;position:relative;z-index:4}
  .pd-toolbar-center{grid-column:2;order:0;position:relative;left:auto;transform:none;justify-self:center;width:auto;z-index:8}
  .pd-toolbar-right{grid-column:3;position:relative;z-index:4}
  .pd-device-picker{display:block;position:relative;z-index:9;pointer-events:auto}
  .pd-device-picker-toggle{position:relative;z-index:10;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .pd-device-picker-menu{z-index:1000002}
}

