.app-stage>astro-island{display:block;height:100%}.px{--px-rail-w: 400px;--px-gap: clamp(12px, 1.4vw, 18px);--px-radius: var(--radius-md);--px-grid: color-mix(in srgb, var(--color-ink) 16%, transparent);--px-chunk: color-mix(in srgb, var(--color-primary) 55%, transparent);display:flex;flex-direction:column;height:100%;overflow:hidden;padding:var(--px-gap);gap:var(--px-gap);font-family:var(--font-body);color:var(--color-ink)}.px *,.px *:before,.px *:after{box-sizing:border-box}.px--welcome{overflow-y:auto}.px-mono{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.px-muted{color:var(--color-muted);font-weight:500}.px-welcome{max-width:560px;margin:clamp(24px,8vh,90px) auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}.px-welcome__icon{width:56px;height:56px}.px-welcome__title{font-family:var(--font-display);font-size:clamp(1.6rem,3.4vw,2.1rem);font-weight:800;letter-spacing:-.03em;margin:4px 0 0}.px-welcome__text{color:var(--color-muted);line-height:1.6;margin:0 0 8px}.px-drop{display:flex;flex-direction:column;gap:12px;width:100%}.px-drop__sample{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.9rem;color:var(--color-muted)}.px-drop--compact{margin-bottom:4px}.px-drop__err{color:var(--color-orange, #d9534f);font-size:.86rem;margin:0}.px-bar{display:flex;align-items:center;gap:12px;flex:none;flex-wrap:wrap}.px-bar__title{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;font-size:1.02rem}.px-bar__toggles{display:flex;gap:6px}.px-bar__spacer{flex:1}.px-bar__pending{font-size:.9rem}.px-togglechip{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-muted);border-radius:999px;padding:6px 12px;font-size:.8rem;font-weight:700;cursor:pointer;transition:all .16s ease}.px-togglechip:hover{border-color:var(--color-border-strong)}.px-togglechip.is-on{background:var(--color-primary-soft);border-color:color-mix(in srgb,var(--color-primary) 45%,transparent);color:var(--color-primary-2, var(--color-primary))}.px-export{display:flex;gap:8px;flex-wrap:wrap}.px-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) var(--px-rail-w);gap:var(--px-gap)}.px-panel{border:1px solid var(--color-border);border-radius:var(--px-radius);background:var(--color-surface);box-shadow:var(--shadow-soft);min-height:0}.px-stagewrap{display:flex;overflow:hidden}.px-rail{display:flex;flex-direction:column;overflow:hidden}.px-preview{display:flex;flex-direction:column;width:100%;min-height:0}.px-preview__scroll{flex:1;min-height:0;overflow:auto;display:grid;place-items:center;padding:16px}.px-stage{position:relative;flex:none;background-image:linear-gradient(45deg,color-mix(in srgb,var(--color-ink) 7%,transparent) 25%,transparent 25%),linear-gradient(-45deg,color-mix(in srgb,var(--color-ink) 7%,transparent) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,color-mix(in srgb,var(--color-ink) 7%,transparent) 75%),linear-gradient(-45deg,transparent 75%,color-mix(in srgb,var(--color-ink) 7%,transparent) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;box-shadow:var(--shadow-card);border-radius:6px;cursor:crosshair}.px-stage__canvas{display:block;width:100%;height:100%;image-rendering:pixelated;border-radius:6px}.px-stage__grid{position:absolute;inset:0;pointer-events:none;background-repeat:repeat,repeat,no-repeat,no-repeat}.px-preview__bar{flex:none;display:flex;align-items:center;gap:14px;padding:10px 14px;border-top:1px solid var(--color-border)}.px-preview__hint{margin-left:auto;font-size:.82rem;color:var(--color-muted)}.px-zoom{display:flex;align-items:center;gap:8px;width:min(280px,50%)}.px-zoom__range{flex:1}.px-zoom__btn{width:30px;height:30px;flex:none;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface-soft);color:var(--color-ink);font-size:1.1rem;line-height:1;cursor:pointer}.px-zoom__btn:disabled{opacity:.4;cursor:default}.px-tabs{flex:none;display:flex;flex-wrap:wrap;gap:4px;padding:10px;border-bottom:1px solid var(--color-border)}.px-tab{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--color-muted);font-size:.82rem;font-weight:700;cursor:pointer;transition:all .15s ease}.px-tab:hover{background:var(--color-surface-soft);color:var(--color-ink)}.px-tab.is-active{background:var(--gradient-primary, var(--color-primary));border-color:transparent;color:#fff}.px-rail__body{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:14px}.px-controls{display:flex;flex-direction:column;gap:14px}.px-row{display:flex;gap:12px;align-items:center}.px-row>*{flex:1}.px-details{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:4px 12px}.px-details>summary{cursor:pointer;font-weight:700;font-size:.86rem;padding:8px 0;color:var(--color-ink)}.px-details__body{display:flex;flex-direction:column;gap:12px;padding:6px 0 12px}.px-color{width:100%;height:40px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer;padding:3px}.px-sw{width:28px;height:28px;flex:none;border-radius:6px;background-size:cover;image-rendering:pixelated;border:1px solid color-mix(in srgb,var(--color-ink) 12%,transparent)}.px-sw--sm{width:22px;height:22px}.px-renew{display:inline-block;width:7px;height:7px;margin-left:6px;border-radius:50%;background:var(--color-green, #5fb863);vertical-align:middle}.px-palette,.px-mat,.px-subs,.px-check,.px-layers{display:flex;flex-direction:column;gap:12px}.px-search{display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-muted);height:42px}.px-search input{border:none;background:none;outline:none;width:100%;font:inherit;color:var(--color-ink)}.px-catlist{display:flex;flex-direction:column;gap:6px}.px-cat{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:8px 10px}.px-cat__head{display:flex;align-items:center;justify-content:space-between;gap:8px}.px-cat__toggle{display:inline-flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;color:var(--color-primary);font-weight:700;font-size:.8rem}.px-cat__count{color:var(--color-muted);font-weight:600}.px-chipgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px;margin-top:10px}.px-chip{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer;text-align:left;opacity:.5;transition:all .14s ease;min-width:0}.px-chip.is-on{opacity:1;border-color:color-mix(in srgb,var(--color-primary) 40%,transparent);background:var(--color-primary-soft)}.px-chip.is-locked{opacity:.35;cursor:not-allowed}.px-chip__sw{width:22px;height:22px;flex:none;border-radius:5px;background-size:cover;image-rendering:pixelated;border:1px solid color-mix(in srgb,var(--color-ink) 12%,transparent)}.px-chip__name{font-size:.78rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.px-chip__coin{flex:none;color:var(--color-orange, #eb8b3d)}.px-empty{color:var(--color-muted);font-size:.88rem;padding:8px 2px;margin:0}.px-mat__summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.84rem;color:var(--color-muted)}.px-dot{opacity:.5}.px-mat__list,.px-check__list{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}.px-mat__row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:var(--radius-sm)}.px-mat__row:hover{background:var(--color-surface-soft)}.px-mat__name{flex:1;min-width:0;display:flex;flex-direction:column;font-weight:600;font-size:.9rem}.px-mat__meta{font-size:.76rem;color:var(--color-muted);font-weight:500}.px-mat__count{font-size:.92rem}.px-subs__hint{font-size:.84rem;color:var(--color-muted);line-height:1.5;margin:0}.px-subs__list{display:flex;flex-direction:column;gap:6px}.px-subs__row{display:flex;align-items:center;gap:8px;padding:6px;border-radius:var(--radius-sm);border:1px solid transparent}.px-subs__row.is-selected{border-color:color-mix(in srgb,var(--color-primary) 50%,transparent);background:var(--color-primary-soft)}.px-subs__from{flex:1;min-width:0;font-size:.86rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.px-subs__arrow{flex:none;color:var(--color-muted)}.px-subs__select{flex:none;width:130px;height:38px}.px-layers__hint{font-size:.84rem;margin:0;line-height:1.5}.px-layers__nav{display:flex;align-items:center;gap:8px}.px-layers__nav input{flex:1}.px-layers__meta{display:flex;gap:8px;align-items:center;font-size:.86rem;color:var(--color-muted)}.px-layers__runs{display:flex;flex-direction:column;gap:3px;list-style:none;margin:0;padding:0;counter-reset:run}.px-layers__run{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:var(--radius-sm);background:var(--color-surface-soft)}.px-layers__run--gap{background:transparent}.px-layers__run-name{flex:1;min-width:0;font-size:.84rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.px-layers__run-x{font-size:.84rem;color:var(--color-muted)}.px-check__head{display:flex;align-items:center;gap:10px}.px-check__progress{flex:1;height:8px;border-radius:999px;background:var(--color-surface-soft);overflow:hidden;border:1px solid var(--color-border)}.px-check__bar{display:block;height:100%;background:var(--gradient-primary, var(--color-primary));transition:width .2s ease}.px-check__count{font-size:.82rem;color:var(--color-muted);flex:none}.px-check__sub{font-size:.82rem;margin:0}.px-check__item{width:100%;display:flex;align-items:center;gap:10px;padding:8px;border-radius:var(--radius-sm);border:none;background:none;cursor:pointer;text-align:left}.px-check__item:hover{background:var(--color-surface-soft)}.px-check__box{width:22px;height:22px;flex:none;border-radius:6px;border:2px solid var(--color-border-strong);display:grid;place-items:center;color:#fff}.px-check__item.is-done .px-check__box{background:var(--color-green, #5fb863);border-color:var(--color-green, #5fb863)}.px-check__item.is-done .px-check__name{text-decoration:line-through;color:var(--color-muted)}.px-check__info{flex:1;min-width:0;display:flex;flex-direction:column}.px-check__name{font-weight:600;font-size:.9rem}.px-check__how{font-size:.76rem}.px-check__qty{flex:none;font-size:.84rem;text-align:right}.px-msg{margin:auto;padding:24px;text-align:center;color:var(--color-muted);max-width:420px}.px-msg--error{color:var(--color-orange, #d9534f)}.px-link{background:none;border:none;color:var(--color-primary);font:inherit;font-weight:700;cursor:pointer;padding:0;text-decoration:underline}.px-spinner{margin:auto;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--color-muted)}.px-spinner__ring{width:32px;height:32px;border-radius:50%;border:3px solid var(--color-border);border-top-color:var(--color-primary);animation:px-spin .8s linear infinite}@keyframes px-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.px-spinner__ring{animation:none}}@media(max-width:920px){.px{overflow-y:auto}.px-main{grid-template-columns:1fr}.px-stagewrap{min-height:56vh}.px-rail{min-height:60vh}}