/*
 * Copyright (c) 2024-2026 ERDesigns (Ernst Reidinga)
 * All rights reserved. This is private software and may not be copied,
 * modified, or distributed without explicit written permission from Ernst Reidinga.
 */
.playground{display:flex;flex-direction:column;height:calc(100vh - 64px - 1rem - 2px - var(--ccb-reserved, 0px));min-height:500px;border:1px solid var(--clr-border);border-radius:var(--radius-lg);overflow:hidden;background:var(--clr-surface);box-shadow:var(--shadow-md)}.pg-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .75rem;background:var(--clr-code-bg);border-bottom:1px solid var(--clr-border);flex-shrink:0}.pg-toolbar-left,.pg-toolbar-right{display:flex;align-items:center;gap:.4rem}.pg-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .7rem;font-size:.8rem;font-weight:600;border:1px solid var(--clr-border);border-radius:var(--radius);background:var(--clr-surface);color:var(--clr-text);cursor:pointer;transition:all var(--transition);white-space:nowrap;font-family:inherit}.pg-btn[hidden]{display:none}.pg-btn-icon,.pg-btn .btn-icon{font-size:.85em;line-height:1;font-style:normal;vertical-align:middle;flex-shrink:0}.pg-btn:hover{border-color:var(--clr-primary-strong);color:var(--clr-primary-strong)}.pg-btn:disabled{opacity:.5;cursor:not-allowed}.pg-btn-run{background:var(--clr-primary);color:var(--clr-primary-contrast);border-color:var(--clr-primary-hover)}.pg-btn-run:hover{background:var(--clr-primary-hover);border-color:var(--clr-primary-hover);color:var(--clr-primary-contrast)}.pg-btn-run:disabled{background:var(--clr-primary);color:var(--clr-primary-contrast)}.pg-btn-debug{background:var(--clr-surface);color:var(--clr-primary-strong);border-color:var(--clr-primary-strong)}.pg-btn-debug:hover{background:var(--clr-primary);border-color:var(--clr-primary-hover);color:var(--clr-primary-contrast)}.pg-btn-debug:disabled{background:var(--clr-surface);color:var(--clr-primary-strong);border-color:var(--clr-primary-strong)}.pg-btn-step{padding:.3rem .5rem;font-size:.85rem}.pg-step-controls{display:inline-flex;align-items:center;gap:.25rem}.pg-step-controls[hidden]{display:none}.pg-select{padding:.3rem .5rem;font-size:.8rem;border:1px solid var(--clr-border);border-radius:var(--radius);background-color:var(--clr-surface);color:var(--clr-text);cursor:pointer;font-family:inherit;transition:border-color var(--transition)}.pg-select:focus{outline:none;border-color:var(--clr-primary-strong);box-shadow:0 0 0 3px rgba(var(--clr-primary-rgb),.15)}.pg-save-wrap{position:relative;display:inline-block}.pg-caret{font-size:.65em;margin-left:2px;opacity:.7}.pg-save-dropdown{position:absolute;top:100%;left:0;z-index:100;min-width:180px;margin-top:2px;padding:4px 0;background:var(--clr-surface);border:1px solid var(--clr-border);border-radius:var(--radius);box-shadow:var(--shadow-md)}.pg-save-option{display:block;width:100%;padding:6px 12px;border:none;background:none;color:var(--clr-text);font-size:.82rem;text-align:left;cursor:pointer;white-space:nowrap;font-family:inherit}.pg-save-option:hover{background:var(--clr-code-bg)}.pg-save-option[disabled]{opacity:.4;cursor:not-allowed}.pg-toggle-label{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;line-height:1;color:var(--clr-text-muted);cursor:pointer;user-select:none;white-space:nowrap;font-family:inherit}.pg-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;width:32px;height:18px;background-color:var(--clr-border);border:none;border-radius:9px;cursor:pointer;margin:0;flex-shrink:0;transition:background-color var(--transition);outline:none}.pg-toggle:before{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;background:var(--clr-surface);border-radius:50%;transition:transform var(--transition)}.pg-toggle:checked{background-color:var(--clr-primary)}.pg-toggle:checked:before{transform:translate(14px)}.pg-toggle:focus-visible{outline:2px solid var(--clr-primary-strong);outline-offset:2px}.pg-toolbar-sep{color:var(--clr-border)}.pg-toolbar-brand{font-size:.75rem;color:var(--clr-text-muted)}.pg-body{display:flex;flex:1;min-height:0;overflow:hidden}.pg-editor-pane{display:flex;flex-direction:column;flex:1;min-width:250px;border-right:none}.pg-splitter{width:5px;cursor:col-resize;background:var(--clr-border);flex-shrink:0;transition:background-color .15s;position:relative;z-index:2}.pg-splitter:hover,.pg-splitter.dragging{background:var(--clr-primary)}.pg-output-pane{display:flex;flex-direction:column;width:40%;min-width:200px;min-height:0}.pg-tabs{display:flex;gap:0;background:var(--clr-code-bg);border-bottom:1px solid var(--clr-border);flex-shrink:0}.pg-tab{padding:.35rem .9rem;font-size:.78rem;font-weight:600;color:var(--clr-text-muted);cursor:pointer;border-bottom:2px solid transparent;transition:all var(--transition);background:none;border-top:none;border-left:none;border-right:none;font-family:inherit}.pg-tab:hover{color:var(--clr-text)}.pg-tab.active{color:var(--clr-primary-strong);border-bottom-color:var(--clr-primary-strong)}.pg-tab-dot{display:inline-block;width:6px;height:6px;margin-left:.35rem;border-radius:50%;background:var(--clr-primary);vertical-align:middle}.pg-editor-wrap{position:relative;flex:1;min-height:0}.pg-disasm{width:100%;height:100%;padding:.75rem 1rem;margin:0;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:.78rem;line-height:1.65;color:var(--clr-text);background:var(--clr-bg);border:none;overflow:auto;white-space:pre}.dasm-section{color:var(--clr-primary-strong);font-weight:700}.dasm-label{color:#c678dd}.dasm-opcode{color:#61afef;font-weight:600}.dasm-reg{color:#e5c07b}.dasm-num{color:#d19a66}.dasm-str{color:#98c379}.dasm-comment{color:var(--clr-text-muted);font-style:italic}.dasm-addr{color:var(--clr-text-muted)}.pg-breakpoint-glyph{background:#e74c3c;border-radius:50%;width:10px!important;height:10px!important;margin-left:4px;margin-top:4px;cursor:pointer}.pg-breakpoint-glyph.pg-breakpoint-disabled{background:transparent;border:2px solid rgba(231,76,60,.4);box-sizing:border-box}.pg-debug-line{background:#ffea002e!important;border-left:3px solid #e6a817!important;box-sizing:border-box}[data-theme=dark] .pg-debug-line{background:#ffea001f!important;border-left-color:#e6a817!important}.pg-debug-arrow-glyph{background:#e6a817;clip-path:polygon(0% 10%,100% 50%,0% 90%);width:12px!important;height:14px!important;margin-left:3px;margin-top:2px}.pg-debug-arrow-glyph.pg-breakpoint-glyph{background:#e6a817;border-radius:0;clip-path:polygon(0% 10%,100% 50%,0% 90%)}.pg-debug-line-border{background:#e6a817;width:3px!important;margin-left:0}.pg-output-tabs{display:flex;gap:0;background:var(--clr-code-bg);border-bottom:1px solid var(--clr-border);flex-shrink:0}.pg-console-wrap{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}.pg-console{flex:1;min-height:0;height:100%;padding:.75rem 1rem;margin:0;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:.78rem;line-height:1.65;color:var(--clr-text);background:var(--clr-bg);overflow:auto;white-space:pre-wrap;word-break:break-word}.pg-console .log-info{color:var(--clr-text)}.pg-console .log-warn{color:var(--clr-warning)}.pg-console .log-error{color:var(--clr-error)}.pg-console .log-success{color:var(--clr-success)}.pg-console .log-muted{color:var(--clr-text-muted)}.pg-console .ansi-bold{font-weight:700}.pg-console .ansi-black{color:#555}.pg-console .ansi-red{color:#e06c75}.pg-console .ansi-green{color:#98c379}.pg-console .ansi-yellow{color:#e5c07b}.pg-console .ansi-blue{color:#61afef}.pg-console .ansi-magenta{color:#c678dd}.pg-console .ansi-cyan{color:#56b6c2}.pg-console .ansi-white{color:#dcdfe4}.pg-console .ansi-bright-black{color:#7f848e}.pg-console .ansi-bright-red{color:#e06c75}.pg-console .ansi-bright-green{color:#98c379}.pg-console .ansi-bright-yellow{color:#e5c07b}.pg-console .ansi-bright-blue{color:#61afef}.pg-console .ansi-bright-magenta{color:#c678dd}.pg-console .ansi-bright-cyan{color:#56b6c2}.pg-console .ansi-bright-white{color:#fff}.pg-console .log-system{color:var(--clr-primary-strong);font-style:italic}.pg-debug-wrap{flex:1;min-height:0;overflow:auto;background:var(--clr-bg)}.pg-debug-sections{display:flex;flex-direction:column}.pg-debug-section{border-bottom:1px solid var(--clr-border)}.pg-debug-header{display:flex;align-items:center;gap:.3rem;padding:.4rem .75rem;font-size:.78rem;font-weight:600;color:var(--clr-text);background:var(--clr-code-bg);cursor:pointer;user-select:none}.pg-debug-header:hover{background:var(--clr-border)}.pg-debug-arrow{display:inline-block;font-size:.7rem;transition:transform .15s ease}.pg-debug-header.open .pg-debug-arrow{transform:rotate(90deg)}.pg-debug-add{margin-left:auto;background:none;border:1px solid var(--clr-border);border-radius:var(--radius);color:var(--clr-text-muted);font-size:.8rem;cursor:pointer;padding:0 .4rem;line-height:1.4}.pg-debug-add:hover{color:var(--clr-primary-strong);border-color:var(--clr-primary-strong)}.pg-debug-body{padding:.4rem .75rem;font-size:.76rem;font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;line-height:1.6}.pg-debug-empty{color:var(--clr-text-muted);font-style:italic;padding:.2rem 0}.pg-debug-frame{display:flex;align-items:baseline;gap:.5rem;padding:.2rem .3rem;cursor:pointer;border-radius:2px;transition:background .1s}.pg-debug-frame:hover{background:var(--clr-code-bg)}.pg-debug-frame.active{background:#e6a81726;border-left:2px solid #e6a817;padding-left:.2rem}.pg-debug-frame-idx{color:var(--clr-text-muted);font-size:.65rem;min-width:1.2rem;text-align:right;flex-shrink:0}.pg-debug-frame-name{color:var(--clr-text);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pg-debug-frame-params{color:var(--clr-text-muted);font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pg-debug-frame-loc{color:var(--clr-text-muted);font-size:.72rem;margin-left:auto;flex-shrink:0}.pg-debug-scope{margin-bottom:.3rem}.pg-debug-scope-name{font-weight:600;color:var(--clr-text-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;padding:.15rem 0}.pg-debug-var{display:flex;align-items:baseline;gap:.5rem;padding:.1rem 0 .1rem .5rem;border-radius:2px;cursor:default;transition:background .1s}.pg-debug-var:hover{background:var(--clr-code-bg)}.pg-debug-var-expand{width:.8rem;font-size:.6rem;color:var(--clr-text-muted);cursor:pointer;flex-shrink:0;user-select:none;text-align:center;transition:transform .15s}.pg-debug-var-expand.open{transform:rotate(90deg)}.pg-debug-var-name{color:#61afef;flex-shrink:0}.pg-debug-var-sep{color:var(--clr-text-muted);flex-shrink:0}.pg-debug-var-value{color:var(--clr-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.pg-debug-var-value.type-string{color:#98c379}.pg-debug-var-value.type-number{color:#d19a66}.pg-debug-var-value.type-boolean{color:#56b6c2}.pg-debug-var-value.type-null,.pg-debug-var-value.type-undefined{color:var(--clr-text-muted);font-style:italic}.pg-debug-var-value.type-object,.pg-debug-var-value.type-array{color:#c678dd}.pg-debug-var-value.type-function{color:#e5c07b}.pg-debug-var-type{color:var(--clr-text-muted);font-size:.65rem;flex-shrink:0;padding:0 .25rem;border-radius:2px;background:#8080801a}.pg-debug-var-children{padding-left:1rem;border-left:1px solid var(--clr-border);margin-left:.4rem}.pg-debug-var-children[hidden]{display:none}.pg-debug-watch-item{display:flex;align-items:baseline;gap:.4rem;padding:.15rem 0;border-radius:2px;transition:background .1s}.pg-debug-watch-item:hover{background:var(--clr-code-bg)}.pg-debug-watch-expr{color:#c678dd}.pg-debug-watch-sep{color:var(--clr-text-muted);flex-shrink:0}.pg-debug-watch-val{color:var(--clr-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.pg-debug-watch-val.watch-error{color:var(--clr-error);font-style:italic}.pg-debug-watch-val.watch-unavailable{color:var(--clr-text-muted);font-style:italic}.pg-ndb-domain{margin-bottom:.5rem;border:1px solid var(--clr-border);border-radius:3px;overflow:hidden}.pg-ndb-domain-title{padding:.2rem .5rem;font-weight:600;font-size:.78rem;letter-spacing:.02em;color:var(--clr-primary-strong);background:var(--clr-code-bg);border-bottom:1px solid var(--clr-border)}.pg-ndb-row{display:flex;align-items:baseline;gap:.5rem;padding:.12rem .5rem}.pg-ndb-row:nth-child(2n){background:var(--clr-code-bg)}.pg-ndb-key{color:var(--clr-text-muted);flex-shrink:0;min-width:40%}.pg-ndb-val{color:var(--clr-text);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;text-align:right}.pg-ndb-tree>summary{cursor:pointer;list-style:none}.pg-ndb-tree>summary::-webkit-details-marker{display:none}.pg-ndb-tree>summary>.pg-ndb-key:before{content:"\25b8";display:inline-block;width:.9em;color:var(--clr-text-muted);transition:transform var(--transition, .15s)}.pg-ndb-tree[open]>summary>.pg-ndb-key:before{transform:rotate(90deg)}.pg-ndb-tree>summary:focus-visible{outline:2px solid var(--clr-primary-strong);outline-offset:-2px}.pg-ndb-summary{color:var(--clr-text-muted);font-style:italic}.pg-ndb-children{margin-left:.9rem;border-left:1px solid var(--clr-border)}.pg-ndb-more{color:var(--clr-text-muted);font-style:italic}.pg-ndb-error{padding:.15rem .5rem;color:var(--clr-error);font-style:italic}.pg-ndb-note{margin-bottom:.5rem;padding:.2rem .5rem;font-size:.72rem;font-style:italic;color:var(--clr-text-muted);border-left:2px solid var(--clr-primary-strong)}.pg-debug-watch-remove{background:none;border:none;color:var(--clr-text-muted);cursor:pointer;font-size:.7rem;padding:0 .2rem;margin-left:auto;opacity:0;transition:opacity .15s;flex-shrink:0}.pg-debug-watch-item:hover .pg-debug-watch-remove{opacity:1}.pg-debug-watch-remove:hover{color:var(--clr-error)}.pg-debug-bp{display:flex;align-items:center;gap:.4rem;padding:.15rem 0;cursor:pointer;border-radius:2px}.pg-debug-bp:hover{background:var(--clr-code-bg)}.pg-debug-bp-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border:1.5px solid var(--clr-error);border-radius:50%;background:var(--clr-error);cursor:pointer;flex-shrink:0;position:relative}.pg-debug-bp-toggle:not(:checked){background:transparent}.pg-debug-bp-toggle:not(:checked)+.pg-debug-bp-loc{text-decoration:line-through;opacity:.5}.pg-debug-bp-icon{color:var(--clr-error);font-size:.7rem}.pg-debug-bp-loc{color:var(--clr-text);flex:1}.pg-debug-bp-remove{background:none;border:none;color:var(--clr-text-muted);cursor:pointer;font-size:.72rem;padding:0 .2rem;opacity:0;transition:opacity .15s}.pg-debug-bp:hover .pg-debug-bp-remove{opacity:1}.pg-debug-bp-remove:hover{color:var(--clr-error)}.pg-debug-bp-cond{color:var(--clr-text-muted);font-size:.72rem}.pg-debug-bp-status{font-size:.6rem;margin-left:auto;padding:0 .3rem;border-radius:3px;font-weight:600;letter-spacing:.03em}.pg-debug-bp-status.verified{color:var(--clr-success)}.pg-debug-bp-status.unresolved{color:var(--clr-text-muted)}.pg-statusbar{display:flex;align-items:center;gap:1.5rem;padding:.3rem .75rem;font-size:.72rem;color:var(--clr-text-muted);background:var(--clr-code-bg);border-top:1px solid var(--clr-border);flex-shrink:0}.pg-statusbar .status-ready{color:var(--clr-success)}.pg-statusbar .status-busy{color:var(--clr-warning)}.pg-statusbar .status-error{color:var(--clr-error)}.pg-statusbar .status-debug{color:#e6a817;font-weight:600}.pg-statusbar .status-paused{color:#e6a817}.pg-status-debug-stats{display:inline-flex;align-items:center;gap:.6rem;font-size:.7rem;color:var(--clr-text-muted)}.pg-status-debug-stats span{display:inline-flex;align-items:center;gap:.2rem}@keyframes pg-step-flash{0%{background:#e6a81759}to{background:#e6a8172e}}.pg-debug-line-flash{animation:pg-step-flash .3s ease-out}.pg-debug-completed{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem;text-align:center;color:var(--clr-text-muted)}.pg-debug-completed-icon{font-size:1.5rem;color:var(--clr-success)}.pg-debug-completed-text{font-size:.82rem;font-weight:600}.pg-debug-completed-stats{font-size:.72rem}.pg-btn-pause{padding:.3rem .5rem;font-size:.85rem}.pg-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0000004d;z-index:10;border-radius:var(--radius-lg)}.pg-loading-spinner{width:2rem;height:2rem;border:3px solid var(--clr-border);border-top-color:var(--clr-primary-strong);border-radius:50%;animation:pg-spin .7s linear infinite}@keyframes pg-spin{to{transform:rotate(360deg)}}.pg-panel{display:block}.pg-panel[hidden]{display:none}@media(max-width:768px){.playground{height:auto;min-height:auto;border-radius:0}.pg-body{flex-direction:column}.pg-editor-pane{border-bottom:1px solid var(--clr-border);min-width:0;min-height:260px;height:50vh;flex:none}.pg-splitter{display:none}.pg-output-pane{width:100%!important;min-height:150px;height:30vh;flex:none}.pg-toolbar{flex-wrap:wrap}.pg-step-controls{display:none}}@media(max-width:480px){.playground{border:none;box-shadow:none}.pg-editor-pane{min-height:200px;height:45vh}.pg-output-pane{min-height:120px;height:25vh}.pg-toolbar-right{display:none}}.playground-page main{flex:1;display:flex;flex-direction:column;padding:.5rem 0}.playground-page main>.container{flex:1;display:flex;flex-direction:column;max-width:100%;padding:0 .5rem}.pg-settings{margin:auto;width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 64px);padding:0;color:var(--clr-text);background:var(--clr-surface);border:1px solid var(--clr-border);border-radius:var(--radius);box-shadow:var(--shadow-md)}.pg-settings::backdrop{background:#00000073}.pg-settings-form{display:flex;flex-direction:column;max-height:calc(100vh - 64px)}.pg-settings-head,.pg-settings-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.75rem 1rem}.pg-settings-head{border-bottom:1px solid var(--clr-border)}.pg-settings-head h2{margin:0;font-size:1rem}.pg-settings-foot{border-top:1px solid var(--clr-border)}.pg-settings-note{margin:0;padding:.6rem 1rem 0;font-size:.8rem;color:var(--clr-text-muted)}.pg-settings-body{overflow-y:auto;padding:.25rem 1rem 1rem}.pg-settings-group h3{margin:1rem 0 .4rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--clr-text-muted)}.pg-settings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:.35rem 1rem}.pg-settings-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-width:0;font-size:.8rem}.pg-settings-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono, monospace)}.pg-settings-row select,.pg-settings-row input[type=number]{flex:0 0 auto;width:9rem;padding:2px 4px;font-size:.78rem;color:var(--clr-text);background:var(--clr-code-bg);border:1px solid var(--clr-border);border-radius:4px}.pg-settings-row.is-locked{opacity:.6}.pg-settings-lock{font-size:.7rem;font-weight:600;color:var(--clr-text-muted)}#pg-btn-settings{position:relative}