.ppd-root{display:flex;flex-direction:column;flex:1;min-height:0;position:relative}.ppd-bar{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:8px var(--pad, 12px);border-bottom:1px solid var(--border);background:var(--bg)}.ppd-lang{height:30px;padding:0 8px;font-size:var(--fs-s);width:auto;max-width:190px}.ppd-run{gap:6px}.ppd-kbd{font:500 10px/1 var(--font-ui);padding:2px 4px;border-radius:4px;background:#ffffff2e;color:#fff}.ppd-stop{color:var(--danger);border-color:var(--danger)}.ppd-sep{width:1px;height:20px;background:var(--border);margin:0 2px}.ppd-bar .btn-ghost.on{background:var(--pro-soft);color:var(--pro)}.ppd-bar .badge-pro{font-size:10px;padding:1px 5px;margin-left:2px}.ppd-avatars{margin-left:auto;display:flex;align-items:center}.ppd-av{width:28px;height:28px;border-radius:50%;border:2px solid #fff;color:#fff;font:650 11px/1 var(--font-ui);display:inline-flex;align-items:center;justify-content:center;margin-left:-6px;cursor:pointer;box-shadow:0 0 0 1px var(--border);padding:0}.ppd-av:first-child{margin-left:0}.ppd-av.me{box-shadow:0 0 0 2px var(--text)}.ppd-av.more{background:var(--bg-3);color:var(--text);cursor:default}.ppd-av:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.ppd-callout{display:flex;align-items:center;gap:10px;padding:8px var(--pad, 12px);background:var(--accent-soft);border-bottom:1px solid #e4e1da;font-size:var(--fs-s);color:var(--text)}.ppd-callout>span{flex:1;min-width:0}.ppd-short{display:none}.ppd-banner{padding:6px 12px;font-size:var(--fs-s);border-bottom:1px solid var(--border)}.ppd-banner.err{background:var(--danger-soft);color:var(--danger)}.ppd-banner.lock{background:var(--warn-soft);color:var(--warn)}.ppd-banner.run{background:var(--bg-2);color:var(--text-2)}.ppd-link{background:none;border:0;padding:0;color:inherit;text-decoration:underline;font:inherit;cursor:pointer}.ppd-main{flex:1;min-height:0;display:grid;grid-template-columns:184px minmax(0,1fr) clamp(340px,30%,560px)}.ppd-files{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--border);background:var(--bg-2)}.ppd-tabs{display:flex;flex-direction:column;gap:2px;padding:8px 6px;overflow:auto;flex:1;min-height:0}.ppd-tab{display:flex;align-items:center;border-radius:var(--radius-s);position:relative;min-width:0}.ppd-tab.on{background:var(--bg);box-shadow:var(--shadow-1)}.ppd-tab-name{flex:1;min-width:0;display:flex;align-items:center;gap:7px;padding:6px 8px;background:none;border:0;font:500 var(--fs-s)/1.2 var(--font-mono);color:var(--text-2);cursor:pointer;text-align:left;border-radius:var(--radius-s)}.ppd-tab.on .ppd-tab-name{color:var(--text);font-weight:600}.ppd-tab-name:hover{color:var(--text);background:var(--bg-3)}.ppd-tab.on .ppd-tab-name:hover{background:transparent}.ppd-fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ppd-here{width:7px;height:7px;border-radius:50%;flex:none}.ppd-tab-acts{display:flex;gap:1px;padding-right:3px}.ppd-icon{width:22px;height:22px;border:0;background:none;border-radius:4px;color:var(--text-2);cursor:pointer;font-size:14px;line-height:1;padding:0}.ppd-icon:hover{background:var(--bg-3);color:var(--text)}.ppd-add{justify-content:flex-start;border:1px dashed var(--border-2);background:none;color:var(--text-2);font:500 var(--fs-s)/1 var(--font-ui);padding:7px 8px;cursor:pointer;margin-top:4px}.ppd-add:hover{color:var(--accent-text);border-color:var(--accent)}.ppd-rename{height:28px;font:500 var(--fs-s) var(--font-mono);padding:0 6px;width:100%}.ppd-roomline{padding:8px 10px;font-size:var(--fs-xs);color:var(--text-2);border-top:1px solid var(--border);line-height:1.35}.ppd-dot{width:8px;height:8px;border-radius:2px;flex:none;background:#827e74}.ppd-dot.l-js{background:#c9a700}.ppd-dot.l-ts{background:#2f74c0}.ppd-dot.l-py{background:#3d7a3d}.ppd-dot.l-sql{background:#b45309}.ppd-dot.l-html{background:#d9480f}.ppd-dot.l-css{background:#3c5a99}.ppd-dot.l-json{background:#4b4f54}.ppd-dot.l-md{background:#0e7490}.ppd-code{min-width:0;min-height:0;display:flex;flex-direction:column;position:relative}.ppd-editor{flex:1;min-height:0;overflow:hidden}.ppd-editor .cm-editor{height:100%}.ppd-side{display:flex;flex-direction:column;min-height:0;min-width:0;border-left:1px solid var(--border);background:var(--bg)}.ppd-side-tabs{display:flex;align-items:center;gap:2px;padding:6px 8px 0;border-bottom:1px solid var(--border);background:var(--bg-2);overflow-x:auto}.ppd-side-tabs button{border:0;background:none;padding:7px 10px;font:550 var(--fs-s)/1 var(--font-ui);color:var(--text-2);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}.ppd-side-tabs button.on{color:var(--text);border-bottom-color:var(--accent)}.ppd-side-tabs button:hover{color:var(--text)}.ppd-side-tabs .ppd-side-act{margin-left:auto;font-weight:500;border-bottom:0;color:var(--accent-text)}.ppd-side-body{flex:1;min-height:0;overflow:auto;position:relative;display:flex;flex-direction:column}.ppd-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--text-2);font-size:var(--fs-s);gap:10px}.ppd-empty h3{margin:0 0 6px;font-size:var(--fs-m);color:var(--text)}.ppd-empty p{margin:0 0 10px;max-width:36ch;line-height:1.5}.ppd-empty.sm{padding:18px 8px}.ppd-side-body>.ppd-empty{justify-content:flex-start;padding-top:56px}.ppd-spinner{width:22px;height:22px;border-radius:50%;border:2.5px solid var(--border);border-top-color:var(--accent);animation:ppd-spin .8s linear infinite;flex:none}.ppd-spinner.sm{width:12px;height:12px;border-width:2px}@keyframes ppd-spin{to{transform:rotate(360deg)}}.ppd-muted{color:var(--text-2);font-size:var(--fs-s)}.ppd-console{font:12.5px/1.5 var(--font-mono);padding:4px 0 12px}.ppd-run-block{border-bottom:1px solid var(--border);padding-bottom:4px}.ppd-run-head{display:flex;align-items:center;gap:8px;padding:6px 12px;font:12px/1.3 var(--font-ui);color:var(--text-2);background:var(--bg-2);position:sticky;top:0;z-index:1}.ppd-run-head>span:nth-child(2){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ppd-run-head strong{color:var(--text);font-weight:600}.ppd-run-dot{width:8px;height:8px;border-radius:50%;flex:none}.ppd-status{font-weight:600;font-size:11px;padding:1px 6px;border-radius:999px;flex:none}.ppd-status.s-ok{color:var(--success);background:var(--success-soft)}.ppd-status.s-error,.ppd-status.s-timeout{color:var(--danger);background:var(--danger-soft)}.ppd-status.s-stopped{color:var(--warn);background:var(--warn-soft)}.ppd-line{margin:0;padding:1px 12px;white-space:pre-wrap;word-break:break-word;font:inherit;color:var(--text)}.ppd-line.l-error{color:var(--danger);background:#fdf3f2}.ppd-line.l-warn{color:var(--warn);background:#fdf8ee}.ppd-line.l-info{color:var(--accent-text)}.ppd-line.l-debug,.ppd-line.l-system{color:var(--text-2);font-style:italic}.ppd-sql{font-size:var(--fs-s)}.ppd-grid-wrap{padding:8px 12px 4px}.ppd-grid-cap{font-size:var(--fs-xs);color:var(--text-2);margin-bottom:4px}.ppd-grid-scroll{overflow:auto;max-height:420px;border:1px solid var(--border);border-radius:var(--radius-s)}.ppd-grid{border-collapse:collapse;font:12.5px/1.4 var(--font-mono);min-width:100%}.ppd-grid th{position:sticky;top:0;background:var(--bg-2);text-align:left;font-weight:650;color:var(--text)}.ppd-grid th,.ppd-grid td{padding:5px 10px;border-bottom:1px solid var(--border);border-right:1px solid var(--border);white-space:nowrap;max-width:320px;overflow:hidden;text-overflow:ellipsis}.ppd-grid td.num{text-align:right}.ppd-grid td.null{color:var(--text-2);font-style:italic}.ppd-grid tr:last-child td{border-bottom:0}.ppd-preview{flex:1;display:flex;flex-direction:column;min-height:0}.ppd-preview-name{padding:4px 12px;font:11.5px var(--font-mono);color:var(--text-2);border-bottom:1px solid var(--border)}.ppd-preview iframe{flex:1;width:100%;min-height:260px;border:0;background:#fff}.ppd-notes{padding:10px 12px 14px;display:flex;flex-direction:column;gap:6px}.ppd-notes-head{display:flex;align-items:center;justify-content:space-between}.ppd-lock-note{display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-xs);font-weight:600;color:var(--pro);background:var(--pro-soft);padding:3px 8px;border-radius:999px}.ppd-label{font-size:var(--fs-xs);font-weight:650;color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;margin-top:6px;display:block}.ppd-notes-ta{min-height:120px;resize:vertical;font:var(--fs-s)/1.5 var(--font-ui);padding:8px 10px}.ppd-score{display:flex;flex-direction:column;gap:6px}.ppd-score-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:var(--fs-s)}.ppd-seg{display:inline-flex;border:1px solid var(--border-2);border-radius:var(--radius-s);overflow:hidden;flex:none}.ppd-seg button{border:0;background:var(--bg);padding:5px 10px;font:550 var(--fs-s)/1 var(--font-ui);color:var(--text-2);cursor:pointer;border-right:1px solid var(--border);min-width:32px}.ppd-seg button:last-child{border-right:0}.ppd-seg button.on{background:var(--accent);color:#fff}.ppd-seg button:hover:not(.on){background:var(--bg-3);color:var(--text)}.ppd-seg-wide{display:flex}.ppd-seg-wide button{flex:1}.ppd-notes-foot{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:8px}.ppd-save{font-size:var(--fs-xs);color:var(--text-2)}.ppd-save.saved{color:var(--success)}.ppd-save.error{color:var(--danger)}.ppd-overlay{position:absolute;inset:0;z-index:6;background:var(--bg);display:flex;flex-direction:column}.ppd-overlay-head{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--border);background:var(--pro-soft)}.ppd-overlay-head strong{color:var(--pro)}.ppd-note{padding:6px 12px;font-size:var(--fs-xs);color:var(--warn);background:var(--warn-soft)}.ppd-tabs-h{flex-direction:row;flex:none;overflow-x:auto;border-bottom:1px solid var(--border);background:var(--bg-2);padding:6px}.ppd-tabs-h .ppd-tab{padding:5px 10px;border:0;background:none;font:500 var(--fs-s) var(--font-mono);color:var(--text-2);cursor:pointer;white-space:nowrap}.ppd-tabs-h .ppd-tab.on{background:var(--bg);color:var(--text)}.ppd-replay-view{flex:1;min-height:0;display:flex;flex-direction:column}.ppd-timeline{border-top:1px solid var(--border);padding:8px 12px 10px;background:var(--bg-2)}.ppd-density{display:flex;align-items:flex-end;gap:1px;height:22px;padding:0 8px}.ppd-density span{flex:1;background:#c9c5bb;border-radius:1px}.ppd-range{width:100%;accent-color:var(--pro);margin:4px 0 6px}.ppd-replay-ctl{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.ppd-speed{display:inline-flex;align-items:center;gap:4px}.ppd-speed select{height:30px;padding:0 6px;width:auto}.ppd-replay-time{margin-left:auto;font:12px var(--font-mono);color:var(--text-2)}.ppd-root kbd{font:500 11px/1 var(--font-ui);padding:2px 5px;border:1px solid var(--border-2);border-bottom-width:2px;border-radius:4px;background:var(--bg);color:var(--text)}.ppd-overlay-head kbd{margin-left:4px}.ppd-modal-bg{position:absolute;inset:0;z-index:7;background:#1b1f2359;display:flex;align-items:flex-start;justify-content:center;padding:40px 12px 12px;overflow:auto}.ppd-modal{background:var(--bg);border-radius:var(--radius-l);box-shadow:var(--shadow-2);width:100%;max-width:440px;padding:16px 18px 18px}.ppd-modal.wide{max-width:620px}.ppd-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.ppd-modal-head h2{margin:0;font-size:var(--fs-l)}.ppd-modal-p{margin:0 0 12px;color:var(--text-2);font-size:var(--fs-s)}.ppd-share-row{display:flex;gap:8px}.ppd-share-row .input{flex:1;min-width:0;height:38px;font-size:12.5px}.ppd-share-qr{display:flex;gap:14px;align-items:center;margin-top:14px}.ppd-share-qr canvas{border:1px solid var(--border);border-radius:var(--radius-s);flex:none;width:140px;height:140px}.ppd-share-qr p{margin:4px 0 0}.ppd-lib-tabs{display:flex;margin:6px 0 12px}.ppd-lib-tabs button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:4px}.ppd-lib-tabs .badge-pro{font-size:10px;padding:1px 5px}.ppd-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow:auto}.ppd-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius)}.ppd-list li>div:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}.ppd-list strong{font-size:var(--fs-m)}.ppd-row-actions{display:flex;gap:4px;flex:none}.ppd-save-tpl{display:flex;gap:8px;margin-bottom:10px}.ppd-save-tpl .input{flex:1;min-width:0;height:32px}.ppd-error{padding:8px 10px;border-radius:var(--radius-s);background:var(--danger-soft);color:var(--danger);font-size:var(--fs-s);margin-bottom:10px}.ppd-keys{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:8px 0 12px;font-size:var(--fs-s)}.ppd-keys dt{white-space:nowrap;color:var(--text)}.ppd-keys dd{margin:0;color:var(--text-2)}.ppd-swatches{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}.ppd-swatches button{width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--border-2);cursor:pointer}.ppd-swatches button.on{box-shadow:0 0 0 2px var(--text)}.ppd-bar::-webkit-scrollbar{display:none}.ppd-bar>*{flex:none}@media(max-width:899px)and (min-width:720px){.ppd-main{grid-template-columns:150px minmax(0,1fr) minmax(240px,40%)}}@media(max-width:719px){.ppd-bar{padding:6px 8px;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent)}.ppd-bar::-webkit-scrollbar{display:none}.ppd-bar>*{flex:none}.ppd-bar:after{content:"";flex:none;width:16px}.ppd-side-tabs button{min-height:44px}.ppd-lang{max-width:118px}.ppd-kbd,.ppd-sep{display:none}.ppd-avatars{margin-left:0}.ppd-callout{padding:6px 8px}.ppd-long{display:none}.ppd-short{display:inline}.ppd-main{display:flex;flex-direction:column}.ppd-files{border-right:0;border-bottom:1px solid var(--border);flex-direction:row;align-items:center}.ppd-tabs{flex-direction:row;overflow-x:auto;padding:6px;flex:1}.ppd-tab{flex:none}.ppd-fname{max-width:120px}.ppd-add{margin-top:0}.ppd-roomline{display:none}.ppd-code{height:max(280px,46dvh);flex:none}.ppd-side{border-left:0;border-top:1px solid var(--border);min-height:300px;flex:none}.ppd-side-body{max-height:420px}.ppd-score-row{flex-wrap:wrap}.ppd-replay-time{margin-left:0;width:100%}.ppd-share-qr canvas{width:110px;height:110px}.ppd-modal-bg{padding-top:12px}.ppd-list li{flex-wrap:wrap}}@media(max-width:719px){.ppd-modal-bg{position:fixed;z-index:70;align-items:flex-end;padding:24px 0 0}.ppd-modal{max-width:none;border-radius:18px 18px 0 0;padding:18px max(16px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}}