*,*:before,*:after{box-sizing:border-box}html,body{height:100%;margin:0;background:#0e0e14;color:#f0eeff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.pg-shell{display:flex;flex-direction:column;height:100vh}.pg-bar{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#18181f;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}.pg-logo{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:inherit;padding:4px 6px;border-radius:6px;transition:background .15s;flex-shrink:0}.pg-logo:hover{background:#ffffff0d}.pg-logo-mark{font-family:SF Mono,Menlo,Consolas,monospace;font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:2px;line-height:1}.pg-logo-mark .b{color:#a78bfa}.pg-logo-mark .t{color:#fff}.pg-logo-name{font-size:13px;font-weight:700;color:#fff;letter-spacing:-.01em}.pg-logo-name .accent{color:#a78bfa}@media (max-width: 720px){.pg-logo-name{display:none}}.pg-divider{width:1px;height:20px;background:#ffffff1a;flex-shrink:0}.pg-back{display:inline-flex;align-items:center;gap:6px;font-family:monospace;font-size:11px;font-weight:600;color:#a78bfa;text-decoration:none;padding:5px 10px;border-radius:6px;border:1px solid rgba(124,108,255,.3);background:#7c6cff14;transition:background .15s,color .15s,border-color .15s}.pg-back:hover{background:#7c6cff38;color:#fff;border-color:#7c6cff99}.pg-name{font-size:13px;font-weight:600;color:#f0eeff;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pg-tag{font-family:monospace;font-size:10px;padding:2px 8px;border-radius:10px;flex-shrink:0}.pg-tag-css{background:#7c6cff1f;color:#7c6cff}.pg-tag-js{background:#f5a6231f;color:#f5a623}.pg-spacer{flex:1}.pg-meta{font-family:monospace;font-size:11px;color:#b8b6d4}@media (max-width: 720px){.pg-meta{display:none}}.pg-share{display:flex;align-items:center;gap:4px;padding:0 4px}.pg-share-label{font-family:monospace;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#6a6e76;margin-right:6px}.pg-share-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:transparent;color:#b8b6d4;cursor:pointer;text-decoration:none;transition:background .14s,color .14s,border-color .14s}.pg-share-btn:hover{background:#ffffff0f;color:#fff}.pg-share-btn:focus-visible{outline:2px solid #a78bfa;outline-offset:1px}#pgShareX:hover{background:#0f0f14f2;border-color:#ffffff2e;color:#fff}#pgShareFb:hover{background:#1877f22e;border-color:#1877f28c;color:#1877f2}#pgShareLi:hover{background:#0a66c22e;border-color:#0a66c273;color:#5aa0e0}#pgShareRd:hover{background:#ff450024;border-color:#ff450066;color:#ff6133}#pgShareLink:hover{background:#7c6cff2e;border-color:#7c6cff73;color:#a78bfa}#pgShareLink.done{background:#2ecc8a24;border-color:#2ecc8a66;color:#2ecc8a}@media (max-width: 720px){.pg-share-label{display:none}}.pg-preview-hint{font-family:monospace;font-size:11px;color:#6a6e76;margin-left:14px}@media (max-width: 1024px){.pg-preview-hint{display:none}}.pg-body{flex:1;display:grid;grid-template-columns:1fr 8px 1fr;min-height:0}.pg-body.dragging{-webkit-user-select:none;-moz-user-select:none;user-select:none;cursor:col-resize}.pg-body.dragging .pg-frame{pointer-events:none}@media (max-width: 720px){.pg-body{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.pg-resizer{display:none}}.pg-resizer{position:relative;background:#2a2a36;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1);cursor:col-resize;transition:background .14s;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pg-resizer:hover,.pg-resizer:focus-visible,.pg-body.dragging .pg-resizer{background:#7c6cff;outline:none}.pg-resizer:before{content:"";width:2px;height:38px;border-radius:2px;background:#ffffff73;box-shadow:0 -10px #ffffff73,0 10px #ffffff73;transition:background .14s,box-shadow .14s}.pg-resizer:hover:before,.pg-resizer:focus-visible:before,.pg-body.dragging .pg-resizer:before{background:#fff;box-shadow:0 -10px #fff,0 10px #fff}.pg-resizer:focus-visible{box-shadow:inset 0 0 0 2px #fff}.pg-editor{display:flex;flex-direction:column;min-width:0;min-height:0;background:#14141b}@media (max-width: 720px){.pg-editor{border-bottom:1px solid rgba(255,255,255,.08)}}.pg-editor-bar{display:flex;align-items:center;background:#18181f;border-bottom:1px solid rgba(255,255,255,.07);padding:0 8px;min-height:38px;flex-shrink:0}.pg-tab{font-family:monospace;font-size:11px;font-weight:600;padding:8px 14px;color:#b8b6d4;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:color .12s,border-color .12s}.pg-tab:hover{color:#f0eeff}.pg-tab.active{color:#a78bfa;border-bottom-color:#7c6cff}.pg-actions{margin-left:auto;display:flex;gap:6px;padding:0 4px}.pg-action{font-family:monospace;font-size:10px;font-weight:600;padding:4px 10px;border-radius:5px;border:1px solid rgba(255,255,255,.13);background:transparent;color:#cbd5e1;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.pg-action:hover{background:#ffffff0f;color:#fff}.pg-action.done{color:#2ecc8a;border-color:#2ecc8a66;background:#2ecc8a1a}.pg-editor-body{flex:1;min-height:0;position:relative;background:#1f1f28}.pg-pane{display:none;position:absolute;inset:0;overflow:hidden}.pg-pane.active{display:block}.pg-editor-el{position:absolute;inset:0;margin:0;padding:14px 16px 14px 56px;background:#1f1f28;color:#d4d4dc;caret-color:#fff;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,Courier New,monospace;font-size:13px;font-weight:400;line-height:1.65;-moz-tab-size:2;-o-tab-size:2;tab-size:2;letter-spacing:0;word-spacing:0;white-space:pre;box-sizing:border-box;overflow:auto;outline:none;counter-reset:pgline;font-variant-ligatures:none;font-feature-settings:normal;font-kerning:none;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.pg-editor-el::selection{background:#7c6cff66}.pg-editor-el::-moz-selection{background:#7c6cff66}.pg-editor-el .pg-line{counter-increment:pgline;display:inline}.pg-editor-el .pg-line:before{content:counter(pgline);display:inline-block;width:38px;margin-left:-50px;padding-right:10px;text-align:right;color:#4a4a58;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}.tk-tag{color:#c4b5fd}.tk-attr{color:#7dd3fc;font-style:italic}.tk-str{color:#fcd34d}.tk-prop{color:#7dd3fc}.tk-sel{color:#c4b5fd}.tk-atrule{color:#f472b6}.tk-kw{color:#c4b5fd}.tk-fn{color:#fcd34d}.tk-num{color:#a3e635}.tk-com{color:#5a5a68;font-style:italic}.tk-pun{color:#9ca3af}.tk-bool,.tk-op{color:#f472b6}.tk-color{color:#a3e635}.pg-preview{display:flex;flex-direction:column;min-width:0;min-height:0;background:#1f1f28}.pg-preview-bar{display:flex;align-items:center;gap:10px;background:#18181f;border-bottom:1px solid rgba(255,255,255,.07);padding:0 16px;min-height:38px;flex-shrink:0}.pg-preview-label{font-family:monospace;font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#b8b6d4}.pg-status{margin-left:auto;font-family:monospace;font-size:10px;color:#b8b6d4;display:inline-flex;align-items:center;gap:5px}.pg-status:before{content:"";width:6px;height:6px;border-radius:50%;background:#2ecc8a}.pg-frame{flex:1;border:0;width:100%;background:#1f1f28;display:block;min-height:0}