.tool-root{--tool-surface:var(--sl-color-bg);--tool-surface-raised:var(--sl-color-gray-7,var(--sl-color-gray-6));--tool-surface-sunken:var(--sl-color-gray-6);--tool-hairline:var(--sl-color-hairline);--tool-border:var(--sl-color-gray-5);--tool-text:var(--sl-color-text);--tool-text-strong:var(--sl-color-white);--tool-text-muted:var(--sl-color-gray-3);--tool-accent:var(--sl-color-text-accent);--tool-accent-solid:var(--sl-color-bg-accent);--tool-accent-on-solid:var(--sl-color-text-invert);--tool-accent-tint:var(--sl-color-accent-low);--tool-radius:.5rem;--tool-radius-sm:.25rem;--tool-control-h:2.125rem;--tool-sticky-top:calc(var(--sl-nav-height) + 1rem);--tool-mono:var(--__sl-font-mono,ui-monospace, monospace);color:var(--tool-text);font-size:var(--sl-text-sm)}.tool-root [hidden]{display:none!important}.tool-root :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--tool-accent);outline-offset:2px;border-radius:var(--tool-radius-sm)}.toolContainer{max-width:75rem;margin:0 auto;padding:0 1.5rem 1.5rem}.toolLead{max-width:75rem;color:var(--tool-text-muted);font-size:var(--sl-text-base);margin:0 auto 1.5rem;padding:0 1.5rem}.ceLayout{align-items:flex-start;gap:2rem;display:flex}.ceNav{top:var(--tool-sticky-top);width:13.75rem;min-width:13.75rem;max-height:calc(100vh - var(--tool-sticky-top) - 2rem);padding-inline-end:.5rem;position:sticky;overflow-y:auto}.ceNavList{font-size:var(--sl-text-xs);border-inline-start:1px solid var(--tool-hairline);flex-direction:column;gap:.125rem;margin:0;padding:0;list-style:none;display:flex}.ceNavItem button{border:0;width:100%;font:inherit;text-align:start;color:var(--tool-text-muted);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:0 0;border-inline-start:2px solid #0000;margin-inline-start:-1px;padding:.3125rem .625rem;transition:color .15s,border-color .15s;display:block;overflow:hidden}.ceNavItem button:hover{color:var(--tool-text-strong);border-inline-start-color:var(--tool-border)}.ceMain{flex-direction:column;flex:1;gap:.5rem;min-width:0;display:flex}.ceSection,.pbPhoneCard{border:1px solid var(--tool-hairline);border-radius:var(--tool-radius);background:var(--tool-surface);overflow:hidden}.ceCard,.ceSubSection,.pbVariantEntry{border:1px solid var(--tool-hairline);border-radius:var(--tool-radius-sm);background:var(--tool-surface-raised);padding:.75rem}.ceCard+.ceCard,.ceSubSection+.ceSubSection,.pbVariantEntry+.pbVariantEntry{margin-top:.5rem}.ceSectionHeader{background:var(--tool-surface-raised);align-items:center;gap:.5rem;padding-inline-end:.875rem;display:flex}.ceSectionTrigger{min-width:0;font:inherit;color:var(--tool-text-strong);text-align:start;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:.5rem;padding:.625rem .875rem;transition:color .15s;display:flex}.ceSectionTrigger:hover{color:var(--tool-accent)}.ceSectionTitle{font-size:var(--sl-text-sm);flex:1;min-width:0;font-weight:600}.ceSectionChevron{width:.75rem;height:.75rem;color:var(--tool-text-muted);flex-shrink:0;transition:transform .2s}.ceSection[data-state=open] .ceSectionChevron{transform:rotate(90deg)}.ceSectionBody{border-top:1px solid var(--tool-hairline);flex-direction:column;gap:.875rem;padding:.875rem;display:flex}.ceSectionDescription{font-size:var(--sl-text-xs);color:var(--tool-text-muted);line-height:1.5}.ceSectionLearnMore,.pbKindDescription a{color:var(--tool-accent);text-underline-offset:.15em}.ceSubSectionTitle,.pbVariantEntryTitle,.ceCardTitle{font-size:var(--sl-text-xs);color:var(--tool-text-strong);font-weight:600}.ceSubSectionTitle,.ceCardTitle{display:block}.ceSubSection{flex-direction:column;gap:.625rem;display:flex}.ceFieldGroup{flex-direction:column;gap:.3125rem;min-width:0;display:flex}.ceLabel,.pbMetaField label,.pbMetaField .pbMetaFieldLabel,.pbRowsHeader,.pbKindSelectLabelRow label{font-size:var(--sl-text-xs);color:var(--tool-text-strong);font-weight:500;display:block}.ceLabelHint,.ceToggleHint{color:var(--tool-text-muted);margin-inline-start:.375rem;font-weight:400}.ceInput,.ceTextarea,.ceSelect,.ceNumberInline,.ceImportTextarea,.ceExportTextarea,.tgNumberInput,.tgHexInput{border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);background:var(--tool-surface);width:100%;color:var(--tool-text-strong);font-family:inherit;font-size:var(--sl-text-sm);padding:.4375rem .625rem;line-height:1.4;transition:border-color .15s,background-color .15s}.ceInput::placeholder,.ceTextarea::placeholder,.ceImportTextarea::placeholder{color:var(--tool-text-muted)}.ceInput:hover,.ceTextarea:hover,.ceSelect:hover{border-color:var(--tool-text-muted)}.ceSelect{appearance:none;cursor:pointer;background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:calc(100% - 1rem) calc(50% + .1em),calc(100% - .7rem) calc(50% + .1em);background-repeat:no-repeat;background-size:.3rem .3rem,.3rem .3rem;padding-inline-end:1.75rem}.ceSelect option{background:var(--sl-color-bg-nav);color:var(--sl-color-gray-1)}.ceTextarea,.ceImportTextarea,.ceExportTextarea{font-family:var(--tool-mono);font-size:var(--sl-text-code-sm);resize:vertical;line-height:1.6}.ceTextarea{min-height:5rem}.ceImportTextarea{min-height:11rem}.ceExportTextarea{background:var(--tool-surface-raised);min-height:18rem}.ceInputSmall,.ceNumberInline,.tgNumberInput{width:auto;min-width:4.5rem;max-width:100%}.ceNumberInline,.tgNumberInput{text-align:center;width:4.5rem}.tgHexInput{min-width:0;font-family:var(--tool-mono);flex:1}.ceToggleRow,.pbKindSelectLabelRow{align-items:center;gap:.5rem;display:flex}.ceToggleLabel{font-size:var(--sl-text-xs);color:var(--tool-text);cursor:pointer}.ceCheckbox{border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);background:var(--tool-surface);width:1rem;height:1rem;color:var(--tool-accent-on-solid);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .15s,border-color .15s;display:inline-flex}.ceCheckbox:hover{border-color:var(--tool-accent)}.ceCheckbox[data-state=checked]{background:var(--tool-accent-solid);border-color:var(--tool-accent-solid)}.ceCheckboxIcon{width:.75rem;height:.75rem}.ceSwitch{border:1px solid var(--tool-border);background:var(--tool-surface);cursor:pointer;border-radius:999px;flex-shrink:0;align-items:center;width:1.875rem;height:1.0625rem;padding:.125rem;transition:background-color .15s,border-color .15s;display:inline-flex}.ceSwitch[data-state=checked]{background:var(--tool-accent-solid);border-color:var(--tool-accent-solid)}.ceSwitchThumb{background:var(--tool-text-muted);border-radius:999px;width:.75rem;height:.75rem;transition:transform .15s,background-color .15s;display:block}.ceSwitch[data-state=checked] .ceSwitchThumb{background:var(--tool-accent-on-solid);transform:translate(.8125rem)}.ceRadioGroup{flex-wrap:wrap;gap:1rem;display:flex}.ceRadioLabel{font-size:var(--sl-text-xs);cursor:pointer;align-items:center;gap:.375rem;display:flex}.ceRadio{accent-color:var(--tool-accent-solid)}.ceRangeRow{align-items:center;gap:.75rem;display:flex}.ceRange{accent-color:var(--tool-accent-solid);flex:1}.ceBtn,.ceImportFileLabel,.pbIconBtn,.pbIconBtnMini,.tgSourceColorRandomizerButton{height:var(--tool-control-h);border:1px solid var(--tool-border);border-radius:var(--tool-radius-sm);background:var(--tool-surface);color:var(--tool-text-strong);font-family:inherit;font-size:var(--sl-text-xs);white-space:nowrap;cursor:pointer;justify-content:center;align-items:center;gap:.375rem;padding:0 .75rem;font-weight:500;line-height:1;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex}.ceBtn:hover:not(:disabled),.ceImportFileLabel:hover,.pbIconBtn:hover:not(:disabled),.pbIconBtnMini:hover:not(:disabled),.tgSourceColorRandomizerButton:hover{background:var(--tool-surface-raised);border-color:var(--tool-text-muted)}.ceBtn:disabled,.pbIconBtn:disabled,.pbIconBtnMini:disabled{opacity:.4;cursor:not-allowed}.ceBtnPrimary,.tgExportButton{background:var(--tool-accent-solid);border-color:var(--tool-accent-solid);color:var(--tool-accent-on-solid)}.ceBtnPrimary:hover:not(:disabled),.tgExportButton:hover{background:var(--tool-accent);border-color:var(--tool-accent)}.ceBtnDanger{color:var(--sl-color-red)}.ceBtnDanger:hover:not(:disabled),.pbIconBtnDanger:hover:not(:disabled){background:var(--sl-color-red-low);border-color:var(--sl-color-red);color:var(--sl-color-red-high)}.ceBtnSmall{height:1.75rem;font-size:var(--sl-text-2xs);padding:0 .5rem}.pbIconBtn{width:var(--tool-control-h);flex-shrink:0;padding:0}.pbIconBtnMini{width:1.375rem;height:1.375rem;font-size:var(--sl-text-2xs);flex-shrink:0;padding:0}.ceIcon{flex-shrink:0;width:1rem;height:1rem}.pbIconBtnMini .ceIcon{width:.75rem;height:.75rem}.ceArrayAddBtn,.pbBrandAddBtn{width:100%;height:var(--tool-control-h);border:1px dashed var(--tool-border);border-radius:var(--tool-radius-sm);color:var(--tool-text-muted);font-family:inherit;font-size:var(--sl-text-xs);cursor:pointer;background:0 0;justify-content:center;align-items:center;gap:.375rem;padding:0 .75rem;transition:border-color .15s,color .15s,background-color .15s;display:inline-flex}.ceArrayAddBtn:hover,.pbBrandAddBtn:hover{border-color:var(--tool-accent);color:var(--tool-accent);background:var(--tool-accent-tint)}.pbBrandAddBtn{border:0;border-top:1px solid var(--tool-hairline);border-radius:0;flex-shrink:0}.pbBrandAddBtn:hover{border-color:var(--tool-hairline);background:var(--tool-surface-raised)}.pbAddPhoneBtn{margin-top:.5rem}.ceArrayRemoveBtn{width:var(--tool-control-h);height:var(--tool-control-h);border-radius:var(--tool-radius-sm);color:var(--tool-text-muted);cursor:pointer;background:0 0;border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:inline-flex}.ceArrayRemoveBtn:hover{background:var(--sl-color-red-low);color:var(--sl-color-red-high)}.ceTabs{border-bottom:1px solid var(--tool-hairline);gap:.25rem;display:flex}.ceTab{color:var(--tool-text-muted);font-family:inherit;font-size:var(--sl-text-xs);cursor:pointer;background:0 0;border:0;padding:.4375rem .75rem;font-weight:500;transition:color .15s;position:relative}.ceTab:after{content:"";inset-inline:.25rem;background:0 0;border-radius:2px 2px 0 0;height:2px;transition:background-color .15s;position:absolute;bottom:-1px}.ceTab:hover{color:var(--tool-text-strong)}.ceTab[data-state=active]{color:var(--tool-accent)}.ceTab[data-state=active]:after{background:var(--tool-accent)}.ceTabsRoot,.ceTabContent{flex-direction:column;gap:.75rem;display:flex}.ceI18nWrapper{flex-direction:column;gap:.625rem;display:flex}.ceArrayEditor,.ceArrayList{flex-direction:column;gap:.375rem;display:flex}.ceArrayItem{align-items:center;gap:.375rem;display:flex}.ceArrayInput{flex:1;min-width:0}.ceCardGrid,.pbMetaGrid{grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.75rem;display:grid}.ceCardHeader,.pbVariantEntryHeader{justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.625rem;display:flex}.pbBrandActions,.pbWorkspaceToolbarActions,.pbBrandHeaderActions{flex-shrink:0;align-items:center;gap:.25rem;display:flex}.ceError,.ceWarnings,.ceSuccess{border-inline-start:3px solid var(--tool-callout-line);border-radius:var(--tool-radius-sm);background:var(--tool-callout-bg);color:var(--tool-callout-text);font-size:var(--sl-text-xs);padding:.625rem .75rem;line-height:1.5}.ceError{--tool-callout-line:var(--sl-color-red);--tool-callout-bg:var(--sl-color-red-low);--tool-callout-text:var(--sl-color-red-high)}.ceWarnings{--tool-callout-line:var(--sl-color-orange);--tool-callout-bg:var(--sl-color-orange-low);--tool-callout-text:var(--sl-color-orange-high)}.ceSuccess{--tool-callout-line:var(--sl-color-green);--tool-callout-bg:var(--sl-color-green-low);--tool-callout-text:var(--sl-color-green-high)}.ceWarnings ul{margin:.25rem 0 0;padding-inline-start:1.25rem}.pbPassthroughWarning{font-size:var(--sl-text-2xs);color:var(--sl-color-orange)}.ceImportPanel{border:1px solid var(--tool-hairline);border-radius:var(--tool-radius);background:var(--tool-surface-raised);flex-direction:column;gap:.75rem;margin-bottom:1.5rem;padding:1rem;display:flex}.ceImportTextareaShort{min-height:7.5rem}.ceImportActions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.ceImportFileInput{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.ceExportBar{z-index:10;border:1px solid var(--tool-hairline);border-radius:var(--tool-radius);background:var(--tool-surface-raised);box-shadow:var(--sl-shadow-md);flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:1rem;padding:.75rem 1rem;display:flex;position:sticky;bottom:0}.ceExportPreview{margin-top:.75rem}.pbLayout{align-items:flex-start;gap:1.25rem;display:flex}.pbPicker{width:16.25rem;min-width:16.25rem;top:var(--tool-sticky-top);max-height:calc(100vh - var(--tool-sticky-top) - 2rem);border:1px solid var(--tool-hairline);border-radius:var(--tool-radius);background:var(--tool-surface);flex-direction:column;display:flex;position:sticky;overflow:hidden}.pbPickerHeader{border-bottom:1px solid var(--tool-hairline);background:var(--tool-surface-raised);align-items:center;gap:.5rem;padding:.625rem .875rem;display:flex}.pbPickerTitle{font-size:var(--sl-text-xs);color:var(--tool-text-strong);flex:1;font-weight:600}.pbPickerCount,.pbBrandButtonCount{font-size:var(--sl-text-2xs);color:var(--tool-text-muted);font-weight:400}.pbPickerList{flex:1;min-height:0;margin:0;padding:.25rem;list-style:none;overflow-y:auto}.pbBrandButton{border-radius:var(--tool-radius-sm);width:100%;color:var(--tool-text);font-size:var(--sl-text-xs);border:1px solid #0000;align-items:center;gap:.5rem;padding:.4375rem .5rem;transition:background-color .12s,border-color .12s,color .12s;display:flex}.pbBrandButtonSelect{min-width:0;color:inherit;font:inherit;text-align:start;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:.5rem;padding:0;display:flex}.pbBrandButton:hover{background:var(--tool-surface-raised)}.pbBrandButtonSelected{background:var(--tool-accent-tint);border-color:var(--tool-accent);color:var(--tool-text-strong);font-weight:600}.pbBrandButtonSelected:hover{background:var(--tool-accent-tint)}.pbBrandButtonLabel{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.pbBrandButtonCount{background:var(--tool-surface-sunken);border-radius:999px;flex-shrink:0;padding:.0625rem .375rem}.pbBrandButtonActions{opacity:0;flex-shrink:0;gap:.125rem;transition:opacity .12s;display:inline-flex}.pbBrandButton:hover .pbBrandButtonActions,.pbBrandButtonSelected .pbBrandButtonActions,.pbBrandButton:focus-within .pbBrandButtonActions{opacity:1}.pbWorkspace{flex:1;min-width:0}.pbWorkspaceHeader{border:1px solid var(--tool-hairline);border-radius:var(--tool-radius);background:var(--tool-surface-raised);margin-bottom:.875rem;padding:.875rem}.pbBrandFields{grid-template-columns:2fr 1fr auto;align-items:end;gap:.75rem;display:grid}.pbWorkspaceToolbar{align-items:center;gap:.5rem;margin-bottom:.625rem;display:flex}.pbWorkspaceToolbarLabel{font-size:var(--sl-text-xs);color:var(--tool-text-strong);flex:1;font-weight:600}.pbPhoneCard+.pbPhoneCard{margin-top:.5rem}.pbPhoneHeader{align-items:center;gap:.5rem;padding-inline-end:.75rem;display:flex}.pbPhoneTrigger{min-width:0;font:inherit;color:inherit;text-align:start;cursor:pointer;background:0 0;border:0;flex:1;align-items:center;gap:.5rem;padding:.4375rem .75rem;display:flex}.pbPhoneTrigger:hover{background:var(--tool-surface-raised)}.pbPhoneSummary{min-width:0;font-size:var(--sl-text-xs);color:var(--tool-text);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.pbPhoneKindBadge{border-radius:var(--tool-radius-sm);background:var(--tool-surface-sunken);color:var(--tool-text-muted);font-size:var(--sl-text-2xs);text-transform:uppercase;letter-spacing:.03em;flex-shrink:0;padding:.0625rem .375rem;font-weight:500}.pbBrandChevron{width:.6875rem;height:.6875rem;color:var(--tool-text-muted);flex-shrink:0;transition:transform .2s}.pbPhoneCard[data-state=open] .pbBrandChevron{transform:rotate(90deg)}.pbPhoneBody{border-top:1px solid var(--tool-hairline);flex-direction:column;gap:.875rem;padding:.875rem;display:flex}.pbKindSelectRow{border-bottom:1px solid var(--tool-hairline);flex-direction:column;gap:.375rem;padding-bottom:.875rem;display:flex}.pbKindDescription{font-size:var(--sl-text-2xs);color:var(--tool-text-muted);line-height:1.5}.pbRowsTable{gap:.375rem;display:grid}.pbRowsHeader{color:var(--tool-text-muted);gap:.375rem;padding-inline:.125rem;display:grid}.pbRow{align-items:center;gap:.375rem;display:grid}.pbRowTwoCol{grid-template-columns:1fr 1fr auto}.pbRowOneCol{grid-template-columns:1fr auto}.pbMetaGrid{border-top:1px solid var(--tool-hairline);padding-top:.875rem}.pbWorkspaceEmpty,.pbEmptyList,.pbEmptyPicker{text-align:center;border:1px dashed var(--tool-hairline);border-radius:var(--tool-radius);color:var(--tool-text-muted);font-size:var(--sl-text-xs);padding:2rem 1.5rem}.pbEmptyPicker{border:0;padding:1.5rem 1rem}.pbEmptyList{margin-bottom:.5rem}@media (width<=56.25rem){.toolContainer,.toolLead{padding-inline:1rem}.ceLayout,.pbLayout{flex-direction:column}.ceNav,.pbPicker{width:100%;min-width:0;max-height:none;padding-inline-end:0;position:static;overflow:visible}.ceNavList{border-inline-start:0;flex-flow:wrap;gap:.25rem}.ceNavItem button{border-inline-start:0;border:1px solid var(--tool-hairline);font-size:var(--sl-text-2xs);border-radius:999px;margin-inline-start:0;padding:.25rem .625rem}.ceNavItem button:hover{border-color:var(--tool-border)}.pbPickerList{max-height:16rem}.ceCardGrid,.pbMetaGrid,.pbBrandFields{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.tool-root *,.tool-root :after{transition-duration:.01ms!important}}
