:root{--pix-black: #2E1948;--pix-white: #FFF;--pix-orange: #e24414;--pix-brand: #D94021;--pix-success: #8DD15E;--pix-warning: #FFC972;--pix-layer-user: #F4845F;--pix-layer-dialogue: #7B8794;--pix-layer-system: #47B881;--pix-layer-environment: #E8A838;--pix-layer-supporting: #52606D;--pix-bg: #FAFBFC;--pix-surface: #FFFFFF;--pix-border: #E4E7EB;--pix-text: #1F2933;--pix-text-muted: #7B8794;--pix-accent: var(--pix-brand);--pix-hover: #F5F7FA;--pix-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--pix-font-mono: "SF Mono", Monaco, "Cascadia Code", monospace;--pix-gap: 8px;--pix-radius: 6px;--pix-radius-lg: 12px;--pix-shadow-sm: 0 1px 2px rgba(0,0,0,.06);--pix-shadow: 0 2px 8px rgba(0,0,0,.08);--pix-shadow-lg: 0 8px 24px rgba(0,0,0,.12);--pix-transition: .15s ease;color-scheme:light}@media(prefers-color-scheme:dark){:root{--pix-bg: #1A1A2E;--pix-surface: #232340;--pix-border: #3A3A5C;--pix-text: #E4E7EB;--pix-text-muted: #9AA5B4;--pix-hover: #2A2A4A;color-scheme:dark}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--pix-font);background:var(--pix-bg);color:var(--pix-text);min-height:100vh;line-height:1.5}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}button{font-family:inherit;font-size:inherit;cursor:pointer;border:none;background:none;color:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--pix-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--pix-text-muted)}:focus-visible{outline:2px solid var(--pix-accent);outline-offset:2px}.pix-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--pix-radius);font-size:.875rem;font-weight:500;transition:all var(--pix-transition);white-space:nowrap;line-height:1.4}.pix-btn:hover{background:var(--pix-hover)}.pix-btn--primary{background:var(--pix-brand);color:var(--pix-white)}.pix-btn--primary:hover{background:var(--pix-orange)}.pix-btn--ghost{background:transparent;color:var(--pix-text-muted)}.pix-btn--ghost:hover{color:var(--pix-text);background:var(--pix-hover)}.pix-btn--icon{padding:6px;border-radius:var(--pix-radius)}.pix-btn--icon svg{width:18px;height:18px}.pix-footer{padding:32px 24px;margin-top:48px;border-top:1px solid var(--pix-border);text-align:center;font-size:.75rem;line-height:1.6;color:var(--pix-text-muted)}.pix-footer p{margin:0}.pix-footer strong{color:var(--pix-text);font-weight:700}.pix-footer a{color:var(--pix-brand, #D94021);text-decoration:none}.pix-footer a:hover{text-decoration:underline}.pix-about{max-width:720px;margin:0 auto;padding:40px 24px}.pix-about-content h1{font-size:2rem;font-weight:700;color:var(--pix-brand);margin-bottom:12px}.pix-about-lead{font-size:1.1rem;color:var(--pix-text-muted);line-height:1.6;margin-bottom:32px}.pix-about-content h2{font-size:1.3rem;font-weight:700;color:var(--pix-brand);margin-top:32px;margin-bottom:12px}.pix-about-content p{font-size:.95rem;line-height:1.7;color:var(--pix-text);margin-bottom:12px}.pix-about-content ul{list-style:disc;padding-left:24px;margin-bottom:16px}.pix-about-content li{font-size:.95rem;line-height:1.7;color:var(--pix-text);margin-bottom:6px}.pix-about-content strong{font-weight:600}.pix-about-content a{color:var(--pix-brand);text-decoration:none}.pix-about-content a:hover{text-decoration:underline}.pix-about-content hr{border:none;border-top:1px solid var(--pix-border);margin:32px 0 16px}.pix-about-version{font-size:.8rem;color:var(--pix-text-muted);font-style:italic}.pix-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000;animation:pix-fade-in .15s ease}.pix-modal{background:var(--pix-surface);border-radius:var(--pix-radius-lg);box-shadow:var(--pix-shadow-lg);padding:24px;max-width:680px;width:92vw;max-height:90vh;overflow-y:auto;animation:pix-slide-up .2s ease}@keyframes pix-fade-in{0%{opacity:0}to{opacity:1}}@keyframes pix-slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.pix-dropdown{position:absolute;top:100%;right:0;margin-top:4px;background:var(--pix-surface);border:1px solid var(--pix-border);border-radius:var(--pix-radius);box-shadow:var(--pix-shadow-lg);min-width:180px;z-index:100;padding:4px;animation:pix-fade-in .1s ease}.pix-dropdown button{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;border-radius:4px;font-size:.875rem;text-align:left}.pix-dropdown button:hover{background:var(--pix-hover)}.pix-score-wrapper{overflow-x:auto;overflow-y:visible;padding:16px 0;scrollbar-width:thin}.pix-score-inner{position:relative;width:fit-content}.pix-score-titles{display:grid;gap:0}.pix-score-body{border:4px solid #ccd4d1;border-radius:8px;overflow:clip}.pix-score-grid,.pix-score-notes{display:grid;gap:0}.pix-section-divider{position:absolute;width:1px;background:#8a9490;z-index:11;pointer-events:none}.pix-layer-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:var(--pix-dark, #636262);background:#e4e7e6;border-right:1px solid #ccd4d1;text-align:center;position:sticky;left:0;z-index:10}.pix-layer-label .pix-layer-icon{width:4em;height:4em;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}.pix-layer-label .pix-layer-icon svg{width:100%;height:100%;display:block}.pix-layer-label .pix-layer-icon svg path{fill:var(--pix-dark, #636262)!important}.pix-layer-label--user{border-bottom:1px dotted #ccd4d1}.pix-layer-label--dialogue{border-bottom:3px solid #ccd4d1}.pix-layer-label--system,.pix-layer-label--environment,.pix-cell--user{border-bottom:1px dotted #ccd4d1}.pix-cell--dialogue{border-bottom:3px solid #ccd4d1}.pix-cell--system,.pix-cell--environment{border-bottom:1px dotted #ccd4d1}.pix-step-header{position:relative;max-width:200px;display:flex;flex-direction:column}.pix-step-grip{height:24px;cursor:grab;border-radius:3px 3px 0 0;opacity:0;transition:opacity .15s;background-image:radial-gradient(circle,#999 1px,transparent 1px);background-size:6px 6px;background-position:2px 2px}.pix-step-header:hover .pix-step-grip{opacity:.4}.pix-step-grip:hover{opacity:.7!important}.pix-step-grip:active{cursor:grabbing}.pix-step-title{padding:4px 8px;font-size:.75rem;font-weight:700;text-align:left;background:transparent;color:var(--pix-brand, #D94021);display:flex;align-items:flex-end;justify-content:flex-start;min-height:28px;outline:none;cursor:text}.pix-step-title[contenteditable=true]:hover,.pix-step-title[contenteditable=true]:focus{background-color:#efefd780;border-radius:3px}.pix-step-title[contenteditable=true]:empty:before{content:attr(data-placeholder);color:var(--pix-text-muted);opacity:0;font-weight:400;transition:opacity .15s}.pix-step-title[contenteditable=true]:hover:empty:before,.pix-step-title[contenteditable=true]:focus:empty:before{opacity:.3}.pix-step-dragging{opacity:.3}.pix-step-drop-before{box-shadow:-3px 0 #ee7d33}.pix-step-drop-after{box-shadow:3px 0 #ee7d33}.pix-step-menu{position:absolute;top:100%;left:0;z-index:50;background:#fff;border:1px solid var(--pix-border, #ccd4d1);border-radius:6px;box-shadow:0 4px 12px #00000026;padding:4px 0;min-width:140px;white-space:nowrap}.pix-step-menu-item{display:block;width:100%;padding:6px 12px;border:none;background:none;font-size:.75rem;text-align:left;cursor:pointer;color:var(--pix-text, #333)}.pix-step-menu-item:hover{background:var(--pix-hover, rgba(239, 239, 215, .5))}.pix-step-menu-item--danger{color:#c0392b}.pix-step-menu-item--danger:hover{background:#c0392b1a}.pix-cell{padding:12px;border-right:none;min-height:120px;max-width:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;background:transparent;transition:background var(--pix-transition),box-shadow var(--pix-transition);cursor:text;line-height:1.3;font-size:.8rem}.pix-cell:hover,.pix-cell:focus-within{box-shadow:0 0 0 2px #efefd7 inset;background-color:#efefd74d;z-index:5}.pix-cell-content{width:100%;min-height:1.5em;outline:none;word-break:break-word}.pix-cell-content:empty:before{content:attr(data-placeholder);color:var(--pix-text-muted);opacity:0;font-style:italic;font-size:.75rem;transition:opacity .15s}.pix-cell:hover .pix-cell-content:empty:before,.pix-cell:focus-within .pix-cell-content:empty:before{opacity:.5}.pix-cell-add-icon{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;border:none;background:#ee7d33;color:#fff;font-size:18px;font-weight:300;line-height:22px;text-align:center;cursor:pointer;opacity:0;transition:opacity .15s;padding:0;z-index:10;box-sizing:border-box}.pix-cell:hover .pix-cell-add-icon,.pix-cell:focus-within .pix-cell-add-icon{opacity:1}.pix-cell-add-icon:hover{background:#d96a20}.pix-cell .pix-icon{width:4em;height:4em;margin-bottom:4px;display:inline-block;vertical-align:middle;flex-shrink:0}.pix-cell .pix-icon svg{width:100%;height:100%;display:block}.pix-step-note{padding:4px 8px;font-size:.75rem;font-style:italic;color:var(--pix-text, #1a1a2e);background:transparent;min-height:24px;max-width:200px;text-align:left;font-family:sans-serif;opacity:.7}.pix-step-note[contenteditable=true]:hover,.pix-step-note[contenteditable=true]:focus{background-color:#efefd74d;box-shadow:0 0 0 2px #efefd7 inset;border-radius:4px}.pix-step-note[contenteditable=true]:empty:before{content:attr(data-placeholder);color:var(--pix-text-muted);opacity:0;transition:opacity .15s}.pix-step-note[contenteditable=true]:hover:empty:before,.pix-step-note[contenteditable=true]:focus:empty:before{opacity:.4}.pix-score-header{margin-bottom:12px}.pix-score-title{font-size:1.5rem;font-weight:700;color:var(--pix-text);border:none;background:none;width:100%;padding:4px 0;border-bottom:2px solid transparent;transition:border-color var(--pix-transition)}.pix-score-title:focus{outline:none;border-bottom-color:var(--pix-accent)}.pix-score-title::placeholder{color:var(--pix-text-muted);opacity:.6}.pix-score-description{font-size:.9rem;font-family:var(--pix-font, system-ui, -apple-system, sans-serif);color:var(--pix-text-muted);border:none;background:none;width:100%;padding:2px 0 4px;resize:none;min-height:1.5em;field-sizing:content;border-bottom:1px solid transparent;transition:border-color var(--pix-transition)}.pix-score-description:focus{outline:none;border-bottom-color:var(--pix-border)}.pix-score-description::placeholder{color:var(--pix-text-muted);opacity:.5}.pix-layout-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;font-size:.7rem;font-weight:600;text-transform:uppercase;border-radius:9999px;background:transparent;color:#ee7d33;border:1.5px solid #ee7d33;letter-spacing:.05em}pix-app{display:block;min-height:100vh}.pix-nav{display:flex;align-items:center;justify-content:space-between;padding:8px 20px;background:var(--pix-surface);border-bottom:1px solid var(--pix-border);position:sticky;top:0;z-index:50;gap:12px}.pix-nav-brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.1rem;color:var(--pix-brand);text-decoration:none}.pix-nav-brand svg{width:28px;height:28px}.pix-nav-version{font-size:.6rem;font-weight:400;color:var(--pix-text-muted);opacity:.6;align-self:flex-end;margin-bottom:2px}.pix-nav-actions{display:flex;align-items:center;gap:8px}.pix-lang-switch{display:flex;border:1px solid var(--pix-border);border-radius:var(--pix-radius);overflow:hidden}.pix-lang-switch button{padding:4px 10px;font-size:.75rem;font-weight:600;text-transform:uppercase;background:transparent;transition:all var(--pix-transition)}.pix-lang-switch button.active{background:var(--pix-black);color:var(--pix-white)}.pix-lang-switch button:not(.active):hover{background:var(--pix-hover)}.pix-editor-topbar{display:flex;justify-content:flex-end;margin-bottom:4px}pix-toolbar{display:block}.pix-toolbar{display:flex;align-items:center;gap:8px;padding:6px 0;flex-wrap:wrap}.pix-toolbar-group{display:flex;align-items:center;gap:4px}.pix-toolbar-separator{width:1px;height:24px;background:var(--pix-border);margin:0 4px}.layout-btn.active{background:transparent!important;color:#ee7d33!important;border:1.5px solid #ee7d33;border-radius:9999px}pix-editor{display:block;padding:16px 20px;max-width:100%}pix-library{display:block;padding:24px 20px;max-width:1200px;margin:0 auto}.pix-library-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px}.pix-library-header h2{font-size:1.5rem;font-weight:700}.pix-library-actions{display:flex;gap:8px;flex-wrap:wrap}.pix-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.pix-card{background:var(--pix-surface);border:1px solid var(--pix-border);border-radius:var(--pix-radius-lg);padding:20px;transition:all var(--pix-transition);cursor:pointer;position:relative}.pix-card:hover{box-shadow:var(--pix-shadow);border-color:var(--pix-accent)}.pix-card-title{font-size:1rem;font-weight:600;margin-bottom:4px;color:var(--pix-text)}.pix-card-desc{font-size:.8rem;color:var(--pix-text-muted);margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pix-card-meta{display:flex;align-items:center;justify-content:space-between;font-size:.7rem;color:var(--pix-text-muted)}.pix-card-actions{display:flex;gap:4px}.pix-card-actions button{padding:4px 8px;border-radius:var(--pix-radius);font-size:.7rem;color:var(--pix-text-muted)}.pix-card-actions button:hover{background:var(--pix-hover);color:var(--pix-text)}.pix-card-actions .delete-btn:hover{color:var(--pix-orange)}.pix-card--new{border-style:dashed;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:160px;color:var(--pix-text-muted);gap:8px}.pix-card--new:hover{color:var(--pix-accent);border-color:var(--pix-accent)}.pix-card--new svg{width:32px;height:32px}.pix-slot-counter{font-size:.8rem;color:var(--pix-text-muted)}pix-icon-picker{display:block}.pix-icon-picker{position:fixed;background:var(--pix-surface);border:1px solid var(--pix-border);border-radius:var(--pix-radius-lg);box-shadow:var(--pix-shadow-lg);padding:12px;z-index:200;width:320px;max-height:400px;display:flex;flex-direction:column;animation:pix-slide-up .15s ease}.pix-icon-picker-search{width:100%;padding:8px 12px;border:1px solid var(--pix-border);border-radius:var(--pix-radius);font-size:.85rem;margin-bottom:8px;background:var(--pix-bg);color:var(--pix-text)}.pix-icon-picker-search:focus{outline:none;border-color:var(--pix-accent)}.pix-icon-picker-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;overflow-y:auto;max-height:300px;padding:4px 0}.pix-icon-picker-separator{grid-column:1 / -1;padding:4px 0;font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--pix-text-muted);border-top:1px solid var(--pix-border);margin-top:4px}.pix-icon-picker-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:var(--pix-radius);cursor:pointer;transition:background var(--pix-transition)}.pix-icon-picker-item:hover,.pix-icon-picker-item.selected{background:var(--pix-hover)}.pix-icon-picker-item.selected{outline:2px solid var(--pix-accent)}.pix-icon-picker-item svg{width:32px;height:32px}.pix-icon-picker-item span{font-size:.55rem;color:var(--pix-text-muted);text-align:center;word-break:break-all;line-height:1.2}.pix-modal--export{min-height:50vh;display:flex;flex-direction:column}.pix-modal--export>div:first-child{flex-shrink:0}.pix-modal--export .pix-embed-section{flex:1;display:flex;flex-direction:column}.pix-modal--export .pix-embed-row{flex:1}.pix-modal--export .pix-embed-code{resize:none}.pix-export-options{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.pix-export-option{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 12px;border:1px solid var(--pix-border);border-radius:var(--pix-radius-lg);cursor:pointer;transition:all var(--pix-transition)}.pix-export-option:hover{border-color:var(--pix-accent);background:var(--pix-hover)}.pix-export-option svg{width:32px;height:32px;color:var(--pix-accent)}.pix-export-option .label{font-weight:600;font-size:.9rem}.pix-export-option .desc{font-size:.7rem;color:var(--pix-text-muted);text-align:center}.pix-embed-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--pix-border)}.pix-embed-row{display:flex;gap:8px;align-items:stretch}.pix-embed-code{flex:1;padding:12px;font-family:var(--pix-font-mono);font-size:.75rem;border:1px solid var(--pix-border);border-radius:var(--pix-radius);background:var(--pix-bg);color:var(--pix-text);resize:vertical;min-height:60px}pix-viewer{display:block;padding:20px}.pix-viewer-title{font-size:1.5rem;font-weight:700;margin-bottom:4px}.pix-viewer-description{font-size:.9rem;color:var(--pix-text-muted);margin-bottom:16px}.pix-new-score-options{display:flex;gap:16px;margin-top:16px}.pix-new-score-option{flex:1;padding:24px 16px;border:2px solid var(--pix-border);border-radius:var(--pix-radius-lg);text-align:center;cursor:pointer;transition:all var(--pix-transition)}.pix-new-score-option:hover{border-color:var(--pix-accent);background:var(--pix-hover)}.pix-new-score-option h3{font-size:1.1rem;margin-bottom:4px}.pix-new-score-option p{font-size:.8rem;color:var(--pix-text-muted)}@media print{.pix-nav,pix-toolbar,.pix-step-actions{display:none!important}body{background:#fff}.pix-score-wrapper{overflow:visible}}@media(max-width:640px){.pix-nav{padding:8px 12px}pix-editor{padding:12px}pix-library{padding:16px 12px}.pix-library-grid{grid-template-columns:1fr}.pix-export-options{grid-template-columns:repeat(2,1fr)}}