:root{color-scheme:dark;font-family:Pretendard Variable,Pretendard,Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,맑은 고딕,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background:#09080f;color:#f5f3ff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-height:100vh;background:radial-gradient(circle at top left,rgba(117,61,230,.22),transparent 28%),radial-gradient(circle at right center,rgba(42,202,238,.12),transparent 26%),#09080f}button,input,textarea{font:inherit}button{cursor:pointer}input,textarea{width:100%;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#f8f7ff;border-radius:12px;padding:11px 12px}textarea{resize:vertical}pre{margin:0;white-space:pre-wrap;word-break:break-word}.appShell{display:flex;min-height:100vh;flex-direction:column;padding:24px;gap:20px}.topBar{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.topBar h1{margin:6px 0 10px;font-size:28px}.topBar p{margin:0;max-width:760px;color:#cfc8ea;line-height:1.55}.topBarStatus{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}.workspaceGrid{display:grid;grid-template-columns:minmax(760px,1.14fr) minmax(620px,.86fr);grid-template-rows:minmax(620px,1fr) minmax(300px,auto) minmax(220px,auto);grid-template-areas:"preview editor" "preview editor" "source source" "diagnostics diagnostics";gap:20px;flex:1}.previewPanel{grid-area:preview;align-self:start}.editorPanel{grid-area:editor}.sourcePanel{grid-area:source}.diagnosticsPanel{grid-area:diagnostics}.panel{background:#0e0c15c7;border:1px solid rgba(255,255,255,.08);border-radius:24px;overflow:hidden;box-shadow:0 20px 60px #0000003d;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.panelHeader{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.08)}.panelHeader h2{margin:0;font-size:17px}.panelCaption{color:#b5aecf;font-size:13px}.panelBody{height:100%}.previewPanel .panelBody{height:auto}.previewBody,.structuredEditorBody,.rawSourceBody,.diagnosticsBody{padding:18px}.previewBody{min-height:100%}.previewBodyDense{padding:16px 16px 88px;display:flex;flex-direction:column;gap:14px;height:auto;max-height:none;overflow:visible}.stitchCard{border:1px solid rgba(255,255,255,.06);background:#221f2a;border-radius:22px;padding:0;color:inherit;text-align:left;overflow:hidden}.stitchGridTile{grid-area:var(--stitch-area, auto)}.stitchButtonCard,.stitchSearchCard,.stitchSpacingCard,.stitchNavCard,.stitchUtilityCard,.stitchMiniSquareCard,.stitchMiniLabelCard,.stitchTypeCardTile,.stitchColorCardTile{min-height:180px;padding:14px 16px}.stitchColorCardTile{padding:0}.stitchButtonGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%;margin-top:12px;align-content:center}.stitchButtonPrimary,.stitchButtonGhost,.stitchButtonLight{display:inline-grid;place-items:center;min-height:30px;padding:0 6px;border-radius:10px;font-size:10px;font-weight:500;line-height:1;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stitchButtonGhost{background:#ffffff08;border:1px solid rgba(255,255,255,.18)}.stitchButtonLight{background:#f3ebff;color:#241635}.stitchSearchCard,.stitchSpacingCard,.stitchNavCard,.stitchUtilityCard,.stitchMiniSquareCard,.stitchMiniLabelCard{display:grid;place-items:center}.stitchSearchShell{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;padding:0 14px}.stitchSearchIcon,.stitchSearchText{color:#b9b3cb}.stitchSpacingLines{display:grid;gap:14px;width:100%}.stitchSpacingLineTrack{height:6px;border-radius:999px;background:#ffffff12;overflow:hidden}.stitchSpacingLineFill{height:100%;border-radius:inherit}.stitchNavPill{display:inline-flex;align-items:center;gap:14px;padding:10px 16px;border-radius:18px}.stitchNavItem{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;font-size:16px}.stitchNavItemActive{color:#fff}.stitchMiniSquare,.stitchMiniLabelButton{display:inline-grid;place-items:center;min-height:36px;border-radius:8px;font-size:14px}.stitchMiniSquare{width:44px;margin:0 auto}.stitchMiniLabelButton{padding:0 16px}.stitchUtilityIcons{display:flex;gap:12px;align-items:center;justify-content:center}.stitchUtilityIcon{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;color:#3b205d;font-size:14px}.stitchUtilityIconDanger{color:#6b1e15}.stitchSamplesGrid{display:grid;grid-template-columns:198px minmax(0,1.18fr) minmax(0,1.14fr) minmax(0,.9fr);grid-template-areas:"color1 type1 buttons search" "color2 type2 spacing nav" "color3 type3 action label" "color4 . utilities utilities";gap:12px;align-items:stretch}.stitchColorCardInner,.stitchTypeCardInner{height:100%}.stitchColorCardInner{border-radius:22px;overflow:hidden;background:#262131}.stitchColorCardTop{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;min-height:88px;padding:18px 18px 12px;color:#fff}.stitchColorCardTop strong,.stitchColorCardTop span{font-size:13px}.stitchColorCardRamp{height:40px;background:linear-gradient(90deg,#000000f2,color-mix(in srgb,var(--tile-color) 20%,black) 18%,color-mix(in srgb,var(--tile-color) 45%,white) 50%,color-mix(in srgb,var(--tile-color) 68%,white) 72%,#fffffffa)}.stitchTypeCardInner{display:flex;flex-direction:column;justify-content:flex-start;gap:10px}.stitchTypeCardTop{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#a9a2bc;font-size:10px;line-height:1;white-space:nowrap;overflow:hidden}.stitchTypeCardTop span:last-child{max-width:44%;overflow:hidden;text-overflow:ellipsis;text-align:right}.stitchTypeHero{display:flex;align-items:center;justify-content:center;min-height:118px;padding-bottom:2px;color:#f5efff}.stitchTypeCardTile{padding:12px 14px 14px}.stitchButtonCard,.stitchSearchCard,.stitchSpacingCard,.stitchNavCard,.stitchMiniSquareCard,.stitchMiniLabelCard,.stitchUtilityCard{background:#241f2d}.stitchButtonCard,.stitchSearchCard,.stitchSpacingCard,.stitchNavCard,.stitchUtilityCard,.stitchMiniSquareCard,.stitchMiniLabelCard,.stitchTypeCardTile{border-color:#ffffff0d}.stitchButtonGrid,.stitchSpacingLines,.stitchUtilityIcons{width:100%}.stitchSearchShell,.stitchNavPill{width:100%;max-width:100%}.stitchMiniSquareCard,.stitchMiniLabelCard,.stitchUtilityCard{display:flex;align-items:center;justify-content:center}.previewHeader{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}.previewHeader h2{margin:6px 0 0;font-size:24px}.previewHeaderDense{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:4px}.previewHeaderDense h2{margin:4px 0 0;font-size:20px}.previewHeaderRight{display:flex;align-items:center;gap:10px;flex-shrink:0}.boardSection{display:flex;flex-direction:column;gap:10px}.boardSectionHeader{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.boardSectionHeader h3{margin:0;font-size:14px;font-weight:600;letter-spacing:.02em}.boardSectionCount{font-size:11px;color:#a9a2bc}.systemSummary{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#ffffff0f;font-size:11px;color:#cfc8ea}.systemSummaryItem strong{color:#f5f3ff}.systemSummaryDot{width:3px;height:3px;border-radius:50%;background:#fff3}.colorStrip{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}.colorStripItem{display:flex;flex-direction:column;min-width:72px;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.06);background:#1e1b26}.colorStripSwatch{height:40px;background:var(--swatch)}.colorStripLabel{display:flex;flex-direction:column;gap:1px;padding:5px 7px 6px}.colorStripName{font-size:10px;font-weight:600;color:#e8e4f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.colorStripValue{font-size:9px;color:#9b94b0;font-family:SFMono-Regular,Consolas,monospace}.typeScaleGrid{display:flex;flex-direction:column;gap:6px}.typeScaleRow{display:flex;align-items:baseline;gap:14px;padding:6px 10px;border-radius:10px;background:#ffffff08;border:1px solid rgba(255,255,255,.04)}.typeScaleSample{min-width:60px;flex-shrink:0}.typeScaleMeta{display:flex;gap:8px;align-items:baseline;font-size:11px}.typeScaleTokenName{font-weight:600;color:#d5cfeb}.typeScaleTokenDetail{font-family:SFMono-Regular,Consolas,monospace;font-size:10px;color:#9b94b0}.boardDualRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}.spacingScaleList{display:flex;flex-direction:column;gap:8px}.spacingScaleRow{display:grid;grid-template-columns:64px 1fr 48px;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#ffffff0b,#ffffff05)}.spacingScaleName{font-size:11px;font-weight:600;color:#d5cfeb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spacingScaleTrack{height:10px;border-radius:999px;background:#ffffff12;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff0a}.spacingScaleFill{height:100%;border-radius:inherit;box-shadow:0 0 18px #753de647}.spacingScaleValue{font-size:11px;font-family:SFMono-Regular,Consolas,monospace;color:#9b94b0;text-align:right}.radiusScaleList{display:flex;flex-direction:column;gap:8px}.radiusScaleRow{display:grid;grid-template-columns:56px 1fr;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#ffffff0b,#ffffff05)}.radiusScalePreview{width:44px;height:44px;flex-shrink:0;box-shadow:inset 0 0 0 1px #ffffff14,0 8px 18px #00000029}.radiusScaleMeta{display:flex;flex-direction:column;gap:3px;align-items:flex-start}.radiusScaleName{font-size:11px;font-weight:600;color:#d5cfeb}.radiusScaleValue{font-size:11px;font-family:SFMono-Regular,Consolas,monospace;color:#9b94b0}.boardComponentGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.denseTile{border-radius:14px;border:1px solid rgba(255,255,255,.06);background:#1e1b26;padding:12px;display:flex;flex-direction:column;gap:10px}.denseTileLabel{font-size:11px;font-weight:600;color:#a9a2bc;text-transform:uppercase;letter-spacing:.06em}.denseTileProps{display:flex;gap:12px;font-size:10px;font-family:SFMono-Regular,Consolas,monospace}.denseButtonGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.denseInputTile .simpleInputShell{min-height:40px}.denseNavTile,.denseMiniActionsTile,.denseIconRailTile,.denseMirrorStatusTile{justify-content:center}.simpleIconRail{display:flex;gap:12px;align-items:center}.simpleRoundIcon{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;color:#3b205d;font-size:14px}.mirrorStatusCardShell{display:grid;gap:10px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:16px}.mirrorStatusLine{height:6px;border-radius:999px}.simpleActionButton{min-height:38px;border:none;box-shadow:none}.simpleActionButtonGhost{background:transparent;border:1px solid rgba(255,255,255,.18)}.simpleActionButtonLight{background:#f3ebff;color:#241635}.simpleInputShell{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:0 16px}.simpleInputIcon,.simpleInputText{color:#b9b3cb}.simpleNavPill{display:inline-flex;align-items:center;gap:14px;padding:12px 18px;border-radius:20px}.simpleNavItem{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;font-size:16px}.simpleNavItemActive{color:#fff}.simpleMiniActionsRow{display:flex;gap:18px;align-items:center}.simpleMiniSquare,.simpleMiniLabelButton{display:inline-grid;place-items:center;min-height:40px;padding:0 18px;border-radius:8px;font-size:14px}.simpleMiniSquare{width:40px;padding:0}.simpleMiniMeta{margin-top:14px;font-size:11px;opacity:.7}.previewGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.previewCard{border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:18px;min-height:220px}.previewCardTall{grid-row:span 2}.previewCard h3{margin:0 0 14px;font-size:15px}.swatchGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.swatchCard{display:flex;flex-direction:column;gap:8px}.swatchColor{min-height:86px;border-radius:16px;border:1px solid rgba(255,255,255,.12)}.swatchMeta{display:flex;justify-content:space-between;gap:12px;font-size:12px}.typePreviewList,.spacingList,.tokenList,.componentList{display:flex;flex-direction:column;gap:12px}.typePreviewCard{border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px;background:#ffffff05}.typePreviewTop,.spacingMeta,.sectionHeaderRow{display:flex;justify-content:space-between;gap:12px;align-items:center}.typePreviewSample{margin-top:10px}.previewButtonRow{display:flex;flex-wrap:wrap;gap:12px}.previewButton{min-width:136px}.previewButtonGhost{padding:14px 28px;background:transparent;border:1px solid rgba(255,255,255,.2)}.previewInputShell{display:flex;align-items:center;gap:10px;padding:14px 16px}.previewInputText,.previewInputIcon{opacity:.85}.spacingRow{display:flex;flex-direction:column;gap:8px}.spacingBarTrack{height:10px;border-radius:999px;background:#ffffff0f;overflow:hidden}.spacingBarFill{height:100%;border-radius:999px}.roundedGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.roundedChipWrap{display:flex;flex-direction:column;align-items:center;gap:8px;color:#cfc8ea;font-size:12px}.roundedChip{width:100%;min-height:58px;border:1px solid rgba(255,255,255,.1)}.previewSampleCard{margin-top:16px;padding:18px;border:1px solid rgba(255,255,255,.08)}.previewSampleCard p{margin:8px 0 0;color:#cfc8ea;line-height:1.55}.eyebrow{color:#b5aecf;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.editorSection{display:flex;flex-direction:column;gap:12px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}.editorSection:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.editorSection h3{margin:0;font-size:15px}.sectionNote{margin:0;color:#bfb8d8;font-size:13px;line-height:1.5}.fieldLabel{display:flex;flex-direction:column;gap:8px;color:#d5cfeb;font-size:13px}.compactField{min-width:0}.formGrid{display:grid;gap:12px}.formGridColumns2,.dualSectionGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.dualSectionGrid{display:grid;gap:18px}.typeScaleList{display:grid;gap:12px}.typeScaleCard,.componentCard,.unsupportedBlockCard{border-radius:18px;border:1px solid rgba(255,255,255,.08);background:#ffffff08;padding:14px}.typeScaleHeader,.componentHeader,.unsupportedHeader{margin-bottom:10px;font-weight:600}.typeScaleMicroLabel{margin-bottom:8px;color:#b5aecf;font-size:11px}.fontControlGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fontControlCard{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:16px;background:#ffffff08;border:1px solid rgba(255,255,255,.06)}.fontControlTitle{font-size:13px;font-weight:700}.fontControlHint,.fontSessionNotice{color:#bfb8d8;font-size:12px;line-height:1.5}.fontPresetSelect{width:100%;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#f8f7ff;border-radius:12px;padding:11px 12px}.fontPresetList,.uploadedFontList{display:flex;flex-direction:column;gap:8px}.fontPresetChip,.uploadedFontChip{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;border:1px solid rgba(255,255,255,.08);background:#ffffff08;color:#f4f0ff;border-radius:12px;padding:10px 12px;text-align:left}.fontPresetChip span,.uploadedFontChip span{color:#bdb5d7;font-size:11px}.fontUploadButton{display:inline-flex;align-items:center;justify-content:center;width:fit-content;border:1px solid rgba(255,255,255,.12);background:#753de62e;color:#f7f3ff;border-radius:12px;padding:10px 14px;cursor:pointer}.fontUploadInput{display:none}.tokenRow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:center}.tokenRowColor{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 52px}.colorChip{width:100%;aspect-ratio:1;border-radius:12px;border:1px solid rgba(255,255,255,.16)}.colorValueField{display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;align-items:center}.colorPickerButton{position:relative;display:inline-flex;width:40px;height:40px;border-radius:12px;overflow:hidden;cursor:pointer;border:1px solid rgba(255,255,255,.18);background:linear-gradient(135deg,#ffffff2e,#ffffff05),var(--picker-color);box-shadow:inset 0 0 0 1px #ffffff14}.colorPickerButton:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent 42%);pointer-events:none}.colorPickerNative{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.rawSourceBody,.structuredEditorBody{max-height:min(78vh,980px);overflow:auto}.structuredEditorBody{height:min(78vh,980px);min-height:0}.fontUploadError{color:#ffb7b7;font-size:12px;line-height:1.5}.sourceResultBody{display:flex;flex-direction:column;gap:14px;min-height:340px}.sourceResultToolbar{display:flex;align-items:center;justify-content:space-between;gap:14px}.sourceResultTitle{color:#d7d0ea;font-size:13px;font-weight:600}.sourceResultActions{display:flex;gap:10px;flex-wrap:wrap}.sourceActionButton{border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#efeaff;border-radius:12px;padding:10px 14px}.sourceActionButtonPrimary{background:#753de6e0;border-color:#beafff3d}.sourcePreviewBox{flex:1;min-height:260px;padding:18px;border-radius:18px;background:#0b0a11;color:#ebe7ff;border:1px solid rgba(255,255,255,.08);font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;line-height:1.55;overflow:auto}.rawSourceTextarea{min-height:420px;height:100%;border-radius:18px;background:#0b0a11;color:#ebe7ff;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;line-height:1.55}.diagnosticsBody{display:flex;flex-direction:column;gap:10px}.diagnosticRow{display:flex;gap:16px;align-items:flex-start;padding:12px 14px;border-radius:16px}.diagnostic-error{background:#ff5f5f1a}.diagnostic-warning{background:#ffc65a1a}.diagnostic-info{background:#78beff1a}.diagnosticMeta{display:flex;gap:8px;min-width:220px;flex-wrap:wrap}.diagnosticCode,.diagnosticLine{color:#cfc8ea;font-size:12px}.pill{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600}.pillDanger{background:#ff5f5f29;color:#ffb7b7}.pillWarning{background:#ffc65a29;color:#ffd87f}.pillSuccess{background:#49df8329;color:#a6f5c0}.pillInfo{background:#78beff29;color:#badaff}.emptyState{display:grid;place-items:center;min-height:180px;text-align:center;color:#cfc8ea;line-height:1.6;padding:24px}.previewEmpty{min-height:100%}.emptyDiagnostics{align-items:flex-start}.localeToggle{border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#f3efff;border-radius:999px;padding:8px 12px}.onboardingCard{border:1px solid rgba(255,255,255,.08);background:#ffffff0a;border-radius:20px;padding:16px 18px}.onboardingTitle{font-weight:700;margin-bottom:10px}.onboardingList{margin:0;padding-left:18px;color:#d6d0ea;line-height:1.6}.boardFriendlyHint{margin:8px 0 0;color:#bcb4d7;font-size:12px}.boardSectionBox,.editorSectionBox{border:1px solid rgba(255,255,255,.06);border-radius:18px;padding:12px;background:#ffffff06}.collapseHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:0;background:transparent;border:none;color:inherit;text-align:left}.collapseChevron{color:#b8afcf;font-size:14px}.boardCollapseHeader{margin-bottom:8px}.groupedPaletteGrid{display:grid;gap:10px}.groupedPaletteCard{border-radius:14px;padding:10px;background:#ffffff08;border:1px solid rgba(255,255,255,.05)}.groupedPaletteHeader{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px;color:#dad3ef;font-size:11px}.colorStripButton,.tokenButton{border:none;padding:0;color:inherit;text-align:left;cursor:pointer}.typeSpecimenBoard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.typeSpecimenCard{display:flex;flex-direction:column;gap:10px;border:1px solid rgba(255,255,255,.06);border-radius:16px;background:#ffffff08;padding:12px;color:inherit;text-align:left}.typeSpecimenHero{color:#f8f5ff}.typeSpecimenSentence{font-size:12px;line-height:1.5}.denseTileDragHandle{align-self:flex-end;color:#8f87a6;font-size:12px}.groupedTokenBlock{display:grid;gap:10px;padding:12px;border-radius:16px;background:#ffffff06;border:1px solid rgba(255,255,255,.05)}.groupedTokenHeader{display:inline-flex;align-items:center;width:fit-content;min-height:32px;padding:0 12px;border-radius:999px;background:#beafff1f;color:#f3efff;font-size:13px;font-weight:800;letter-spacing:.01em}.colorValueFieldExpanded{grid-template-columns:40px minmax(0,1fr);grid-template-rows:auto auto}.colorValueFieldExpanded>.alphaControls{grid-column:1 / -1}.alphaControls{display:grid;grid-template-columns:1fr 58px 18px;gap:8px;align-items:center}.alphaNumberInput{text-align:right}.alphaSuffix{color:#bfb7d8;font-size:12px}.tokenInteractive{cursor:pointer}.targetHighlight{box-shadow:0 0 0 1px #beafff73,0 0 0 8px #753de614}.liveTypeSpecimen{padding:8px 0 4px;color:#f6f1ff}@media(max-width:1380px){.workspaceGrid{grid-template-columns:1fr;grid-template-areas:"preview" "editor" "source" "diagnostics";grid-template-rows:auto}.previewGrid,.typeSpecimenBoard,.fontControlGrid,.stitchSamplesGrid,.dualSectionGrid,.formGridColumns2,.tokenRow,.tokenRowColor,.boardDualRow,.boardComponentGrid{grid-template-columns:1fr}.stitchSamplesGrid{grid-template-areas:none}.stitchGridTile{grid-area:auto}.topBar{flex-direction:column}.topBarStatus{justify-content:flex-start}.diagnosticRow{flex-direction:column}.diagnosticMeta{min-width:0}.previewHeaderDense{flex-direction:column;gap:8px}.previewBodyDense,.structuredEditorBody{height:auto;max-height:none}.previewHeaderRight,.colorStrip{flex-wrap:wrap}}