.ComponentDiscovery-module__ZrDjyG__layout{grid-template-columns:17rem minmax(0,1fr);align-items:start;gap:32px;display:grid}.ComponentDiscovery-module__ZrDjyG__tabRail{min-width:0}.ComponentDiscovery-module__ZrDjyG__railHeading{color:var(--color-content-faint);letter-spacing:.08em;text-transform:uppercase;justify-content:flex-start;align-items:center;margin-bottom:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1.4;display:flex}.ComponentDiscovery-module__ZrDjyG__tabs{flex-direction:column;gap:2px;display:flex}.ComponentDiscovery-module__ZrDjyG__tab{text-align:left;width:100%;min-width:0;min-height:0;color:var(--color-content-muted);cursor:pointer;background:0 0;border:0;border-radius:8px;align-items:center;gap:10px;padding:8px 10px;font-family:inherit;font-size:14px;line-height:1.375rem;transition:background-color .15s,color .15s;display:flex;position:relative}.ComponentDiscovery-module__ZrDjyG__tab[aria-selected=true]{background:var(--color-surface);color:var(--color-brand)}.ComponentDiscovery-module__ZrDjyG__tab:not([aria-selected=true]):hover{background:color-mix(in srgb, var(--color-surface) 60%, transparent);color:var(--color-content)}.ComponentDiscovery-module__ZrDjyG__icon{width:32px;height:32px;color:inherit;flex-shrink:0;place-items:center;display:grid}.ComponentDiscovery-module__ZrDjyG__tabs strong{font-size:inherit;font-weight:400;display:block}.ComponentDiscovery-module__ZrDjyG__panels{min-width:0}.ComponentDiscovery-module__ZrDjyG__panel{border-radius:10px;min-width:0}.ComponentDiscovery-module__ZrDjyG__panel:not([hidden]){animation:.24s both ComponentDiscovery-module__ZrDjyG__view-panel-in}.ComponentDiscovery-module__ZrDjyG__panelHeading{text-align:left;margin:0 0 20px}.ComponentDiscovery-module__ZrDjyG__panelHeading h3{color:var(--color-content);letter-spacing:-.025em;margin:0;font-size:21px;font-weight:550;line-height:1.35}.ComponentDiscovery-module__ZrDjyG__panelHeading p{max-width:680px;color:var(--color-content-muted);margin:7px 0 0;font-size:14px;line-height:1.65}.ComponentDiscovery-module__ZrDjyG__image{border:1px solid var(--color-surface-border);background:var(--color-surface-well);border-radius:10px;width:100%;height:auto;display:block}.ComponentDiscovery-module__ZrDjyG__caption{margin-top:20px}.ComponentDiscovery-module__ZrDjyG__link{color:var(--color-brand);border-radius:4px;justify-content:center;align-items:center;gap:7px;width:fit-content;margin:18px auto 0;font-size:13px;display:flex}.ComponentDiscovery-module__ZrDjyG__panel:focus-visible,.ComponentDiscovery-module__ZrDjyG__link:focus-visible,.ComponentDiscovery-module__ZrDjyG__tab:focus-visible{outline:2px solid var(--color-brand);outline-offset:4px}@keyframes ComponentDiscovery-module__ZrDjyG__view-panel-in{0%{opacity:.55}to{opacity:1}}@media (max-width:1023px){.ComponentDiscovery-module__ZrDjyG__layout{grid-template-columns:14rem minmax(0,1fr);gap:20px}.ComponentDiscovery-module__ZrDjyG__caption{font-size:12px}}@media (max-width:767px){.ComponentDiscovery-module__ZrDjyG__layout{grid-template-columns:1fr;gap:22px}.ComponentDiscovery-module__ZrDjyG__tabs{scrollbar-width:none;flex-direction:row;gap:2px;min-width:0;padding:2px 0 6px;overflow-x:auto}.ComponentDiscovery-module__ZrDjyG__tab{white-space:nowrap;flex-shrink:0;gap:7px;width:auto;min-height:44px;padding:6px 9px}.ComponentDiscovery-module__ZrDjyG__icon{width:24px;height:24px}.ComponentDiscovery-module__ZrDjyG__icon svg{width:20px;height:20px}.ComponentDiscovery-module__ZrDjyG__caption{margin-top:14px}.ComponentDiscovery-module__ZrDjyG__panelHeading{margin-bottom:14px}.ComponentDiscovery-module__ZrDjyG__panelHeading h3{font-size:18px}.ComponentDiscovery-module__ZrDjyG__panelHeading p{font-size:13px}.ComponentDiscovery-module__ZrDjyG__link{margin-top:14px}.ComponentDiscovery-module__ZrDjyG__image{border-radius:8px}}@media (prefers-reduced-motion:reduce){.ComponentDiscovery-module__ZrDjyG__tab,.ComponentDiscovery-module__ZrDjyG__panel:not([hidden]){transition:none;animation:none}}
.DesignSystemProblem-module__LqRZNW__intro{text-align:center;max-width:850px;margin:0 auto}.DesignSystemProblem-module__LqRZNW__description{max-width:660px;color:var(--color-content-muted);text-wrap:pretty;margin:20px auto 0;font-size:18px;line-height:1.8}.DesignSystemProblem-module__LqRZNW__comparison{grid-template-columns:1fr 1fr;gap:28px;max-width:1120px;margin:40px auto 0;display:grid}.DesignSystemProblem-module__LqRZNW__problem,.DesignSystemProblem-module__LqRZNW__solution{flex-direction:column;min-width:0;padding:24px;display:flex;position:relative}.DesignSystemProblem-module__LqRZNW__problem{border-right:1px solid var(--color-rule);padding-left:4px;padding-right:28px}.DesignSystemProblem-module__LqRZNW__solution{background:var(--color-surface);border-radius:18px;overflow:hidden;box-shadow:inset 0 1px #ffffff04}.DesignSystemProblem-module__LqRZNW__watermark{pointer-events:none;opacity:.65;position:absolute;top:-24px;right:-30px}.DesignSystemProblem-module__LqRZNW__mark{background:var(--color-surface-raised);border-radius:13px;place-items:center;width:56px;height:56px;margin-bottom:18px;display:grid;position:relative}.DesignSystemProblem-module__LqRZNW__comparison h3{letter-spacing:-.035em;font-size:21px;font-weight:600;line-height:1.3;position:relative}.DesignSystemProblem-module__LqRZNW__headline{letter-spacing:-.025em;text-wrap:pretty;margin-top:10px;font-size:19px;font-weight:500;line-height:1.5;position:relative}.DesignSystemProblem-module__LqRZNW__body{color:var(--color-content-muted);text-wrap:pretty;margin-top:12px;font-size:16px;line-height:1.8;position:relative}.DesignSystemProblem-module__LqRZNW__workflow{margin:22px 0;position:relative}.DesignSystemProblem-module__LqRZNW__workflowLabel{text-transform:uppercase;letter-spacing:.07em;color:var(--color-content-faint);margin-bottom:10px;font-family:monospace;font-size:10px}.DesignSystemProblem-module__LqRZNW__steps{align-items:center;gap:8px;padding:0;list-style:none;display:flex}.DesignSystemProblem-module__LqRZNW__steps>span{background:var(--color-surface-raised);color:var(--color-content-muted);text-align:center;border:1px solid #0000;border-radius:6px;flex:1;padding:9px 10px;font-size:12px;line-height:1.4}.DesignSystemProblem-module__LqRZNW__steps>svg{color:var(--color-content-faint);flex-shrink:0}.DesignSystemProblem-module__LqRZNW__followup{color:var(--color-content-faint);margin-top:12px;font-size:12px}.DesignSystemProblem-module__LqRZNW__solution .DesignSystemProblem-module__LqRZNW__steps>span{border-color:color-mix(in srgb, var(--color-brand) 25%, transparent);background:color-mix(in srgb, var(--color-brand) 6%, var(--color-surface));color:var(--color-content)}.DesignSystemProblem-module__LqRZNW__solution .DesignSystemProblem-module__LqRZNW__steps>svg{color:var(--color-brand)}.DesignSystemProblem-module__LqRZNW__reviewLoop{color:var(--color-brand);justify-content:center;align-items:center;gap:12px;margin:14px 12px 0;font-size:12px;display:flex}.DesignSystemProblem-module__LqRZNW__reviewLoop>span:nth-child(2){color:var(--color-content-muted);border:1px solid color-mix(in srgb, var(--color-brand) 25%, transparent);background:color-mix(in srgb, var(--color-brand) 5%, transparent);border-radius:6px;padding:7px 12px}.DesignSystemProblem-module__LqRZNW__reviewLoop>span:first-child,.DesignSystemProblem-module__LqRZNW__reviewLoop>span:last-child{font-size:22px}.DesignSystemProblem-module__LqRZNW__verdict{background:color-mix(in srgb, var(--color-danger) 6%, transparent);border-radius:9px;align-items:flex-start;gap:12px;margin-top:auto;padding:16px;display:flex;position:relative}.DesignSystemProblem-module__LqRZNW__verdict>svg{color:var(--color-danger);flex-shrink:0;margin-top:2px}.DesignSystemProblem-module__LqRZNW__verdict>div>span{letter-spacing:.13em;text-transform:uppercase;color:var(--color-danger);font:11px monospace}.DesignSystemProblem-module__LqRZNW__verdict p{color:var(--color-content-muted);text-wrap:pretty;margin-top:6px;font-size:15px;line-height:1.7}.DesignSystemProblem-module__LqRZNW__solution .DesignSystemProblem-module__LqRZNW__verdict{background:color-mix(in srgb, var(--color-brand) 10%, transparent)}.DesignSystemProblem-module__LqRZNW__solution .DesignSystemProblem-module__LqRZNW__verdict>svg,.DesignSystemProblem-module__LqRZNW__solution .DesignSystemProblem-module__LqRZNW__verdict>div>span{color:var(--color-brand)}@media (max-width:1100px){.DesignSystemProblem-module__LqRZNW__comparison{gap:20px}.DesignSystemProblem-module__LqRZNW__problem,.DesignSystemProblem-module__LqRZNW__solution{padding:24px}.DesignSystemProblem-module__LqRZNW__problem{padding-left:0}.DesignSystemProblem-module__LqRZNW__headline{font-size:20px}.DesignSystemProblem-module__LqRZNW__steps{gap:5px}.DesignSystemProblem-module__LqRZNW__steps>span{padding:9px 7px;font-size:11px}.DesignSystemProblem-module__LqRZNW__steps>svg{width:13px}.DesignSystemProblem-module__LqRZNW__verdict{padding:16px}.DesignSystemProblem-module__LqRZNW__verdict p{font-size:14px}.DesignSystemProblem-module__LqRZNW__watermark{width:170px;height:auto}}@media (max-width:767px){.DesignSystemProblem-module__LqRZNW__description{font-size:16px}.DesignSystemProblem-module__LqRZNW__comparison{grid-template-columns:1fr;gap:24px;margin-top:32px}.DesignSystemProblem-module__LqRZNW__problem{border:0;border-bottom:1px solid var(--color-rule);padding:12px 4px 32px}.DesignSystemProblem-module__LqRZNW__solution{padding:24px 20px}.DesignSystemProblem-module__LqRZNW__mark{border-radius:14px;width:56px;height:56px;margin-bottom:18px}.DesignSystemProblem-module__LqRZNW__headline{min-height:0;font-size:21px}.DesignSystemProblem-module__LqRZNW__body{min-height:0;font-size:15px}.DesignSystemProblem-module__LqRZNW__workflow{min-height:0;margin:22px 0}.DesignSystemProblem-module__LqRZNW__workflowLabel{font-size:9px}.DesignSystemProblem-module__LqRZNW__steps{gap:5px}.DesignSystemProblem-module__LqRZNW__steps>span{padding:9px 7px;font-size:11px}.DesignSystemProblem-module__LqRZNW__verdict p{font-size:14px}.DesignSystemProblem-module__LqRZNW__reviewLoop{gap:7px;margin-left:0;margin-right:0;font-size:11px}.DesignSystemProblem-module__LqRZNW__reviewLoop>span:nth-child(2){padding:7px 8px}.DesignSystemProblem-module__LqRZNW__watermark{width:165px;top:-20px;right:-25px}}@media (max-width:360px){.DesignSystemProblem-module__LqRZNW__steps>span{padding:8px 5px;font-size:10px}.DesignSystemProblem-module__LqRZNW__solution{padding:22px 16px}.DesignSystemProblem-module__LqRZNW__reviewLoop{font-size:10px}}
.SingleComponentDemo-module__tKsJQq__demo{--accent:#13c39e;--fg:#eceeef;--muted:#92989d;--line:#303236;color:var(--fg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#111214;border:1px solid #343638;border-radius:14px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;position:relative;overflow:hidden;box-shadow:0 24px 70px -42px #000}.SingleComponentDemo-module__tKsJQq__application{height:clamp(580px,53vw,760px);min-height:580px;overflow:hidden}.SingleComponentDemo-module__tKsJQq__motionButton{z-index:8;color:#d2d6d8;cursor:pointer;background:#202225;border:1px solid #404347;border-radius:6px;justify-content:center;align-items:center;gap:7px;min-height:28px;padding:0 9px;font-size:10px;transition:background-color .15s,color .15s;display:inline-flex;position:absolute;top:9px;right:12px}.SingleComponentDemo-module__tKsJQq__motionButton:hover:not(:disabled){color:#fff;background:#2a2c2f}.SingleComponentDemo-module__tKsJQq__motionButton:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.SingleComponentDemo-module__tKsJQq__motionButton:disabled{cursor:default;opacity:.72}.SingleComponentDemo-module__tKsJQq__motionButton svg{fill:none;stroke:currentColor}.SingleComponentDemo-module__tKsJQq__appHeader{color:#b6babd;white-space:nowrap;background:#1b1c1e;border-bottom:1px solid #292b2e;align-items:center;gap:15px;height:49px;padding:0 108px 0 14px;font-size:11px;display:flex}.SingleComponentDemo-module__tKsJQq__traffic{gap:7px;display:flex}.SingleComponentDemo-module__tKsJQq__traffic i{background:#ee685f;border-radius:50%;width:11px;height:11px}.SingleComponentDemo-module__tKsJQq__traffic i:nth-child(2){background:#eab84e}.SingleComponentDemo-module__tKsJQq__traffic i:nth-child(3){background:#5fc26d}.SingleComponentDemo-module__tKsJQq__project{color:#e4e6e7;border:1px solid #2f3134;border-radius:6px;align-items:center;gap:7px;padding:6px 8px;display:flex}.SingleComponentDemo-module__tKsJQq__hexbyMark{width:19px;height:22px;color:var(--accent);flex:none;display:inline-grid}.SingleComponentDemo-module__tKsJQq__hexbyMark img{object-fit:contain;width:100%;height:100%}.SingleComponentDemo-module__tKsJQq__chevron{color:#858b90;font-size:12px}.SingleComponentDemo-module__tKsJQq__search{color:#777e83;border:1px solid #35383b;border-radius:6px;align-items:center;gap:8px;width:min(31%,315px);margin:0 auto;padding:6px 9px;display:flex}.SingleComponentDemo-module__tKsJQq__search svg,.SingleComponentDemo-module__tKsJQq__headerRight svg{fill:none;stroke:currentColor;stroke-width:1.6px;width:14px;height:14px}.SingleComponentDemo-module__tKsJQq__search svg{color:var(--accent)}.SingleComponentDemo-module__tKsJQq__search kbd{margin-left:auto;font-family:inherit;font-size:9px}.SingleComponentDemo-module__tKsJQq__headerRight{align-items:center;gap:8px;display:flex}.SingleComponentDemo-module__tKsJQq__headerRight>svg:first-child{color:var(--accent)}.SingleComponentDemo-module__tKsJQq__assigned{align-items:center;gap:5px;margin-left:12px;display:flex}.SingleComponentDemo-module__tKsJQq__assigned svg{width:17px;height:17px;color:var(--accent)}.SingleComponentDemo-module__tKsJQq__ship{color:#08221c;background:#08ad8b;border-radius:6px;align-items:center;gap:6px;padding:7px 10px;font-weight:650;display:flex}.SingleComponentDemo-module__tKsJQq__ship>span{font-size:15px}.SingleComponentDemo-module__tKsJQq__avatar{color:#d4d8d9;background:#282a2d;border:1px solid #3b3e41;border-radius:50%;place-items:center;width:25px;height:25px;font-size:9px;display:grid}.SingleComponentDemo-module__tKsJQq__workArea{grid-template-columns:220px minmax(0,1fr) 285px;height:calc(100% - 49px);min-height:0;display:grid}.SingleComponentDemo-module__tKsJQq__explorer{background:#191a1c;border-right:1px solid #292b2e;min-width:0;display:flex}.SingleComponentDemo-module__tKsJQq__rail{color:#747a7f;border-right:1px solid #2a2c2f;flex-direction:column;flex:0 0 44px;align-items:center;gap:20px;padding:13px 0;font-size:15px;display:flex}.SingleComponentDemo-module__tKsJQq__rail>.SingleComponentDemo-module__tKsJQq__hexbyMark{margin-bottom:2px}.SingleComponentDemo-module__tKsJQq__activeRail{width:28px;height:28px;color:var(--accent);background:#29302f;border-radius:6px;place-items:center;display:grid}.SingleComponentDemo-module__tKsJQq__fileTree{color:#9ca1a5;white-space:nowrap;flex-direction:column;flex:1;min-width:0;padding:10px 8px;font-size:11px;display:flex;overflow:hidden}.SingleComponentDemo-module__tKsJQq__treeHeader{color:#777d82;letter-spacing:.06em;justify-content:space-between;align-items:center;height:25px;margin-bottom:5px;font-size:10px;display:flex}.SingleComponentDemo-module__tKsJQq__treeTools{color:#7d8387;align-items:center;gap:7px;display:inline-flex}.SingleComponentDemo-module__tKsJQq__treeTools svg{stroke:currentColor;width:13px;height:13px}.SingleComponentDemo-module__tKsJQq__treeFolder{color:#c0c4c6;flex:none;align-items:center;gap:6px;height:25px;padding:0 4px;display:flex}.SingleComponentDemo-module__tKsJQq__treeFolder>svg:first-child{color:#858b90}.SingleComponentDemo-module__tKsJQq__treeFolderIcon{color:#92989d;flex:none;width:14px;height:14px}.SingleComponentDemo-module__tKsJQq__treeNested{border-left:1px solid #303236;flex-direction:column;min-width:0;margin-left:10px;padding-left:7px;display:flex}.SingleComponentDemo-module__tKsJQq__treeItem{color:#9ca1a5;text-overflow:ellipsis;border-radius:5px;flex:none;align-items:center;gap:7px;min-width:0;height:24px;padding:0 5px 0 7px;display:flex;overflow:hidden}.SingleComponentDemo-module__tKsJQq__treeItem svg{color:#00b08c;fill:none;stroke:currentColor;stroke-width:1.3px;flex:none;width:13px;height:13px}.SingleComponentDemo-module__tKsJQq__treeItem span{text-overflow:ellipsis;overflow:hidden}.SingleComponentDemo-module__tKsJQq__treeFileIcon{color:#b5b9bc;flex:none;width:13px;height:13px}.SingleComponentDemo-module__tKsJQq__selectedFile{color:#f0f1f2;background:#2a2c2f}.SingleComponentDemo-module__tKsJQq__canvas{background:#151618;flex-direction:column;min-width:0;display:flex;position:relative;overflow:hidden}.SingleComponentDemo-module__tKsJQq__canvasHeader{color:#c4c8ca;border-bottom:1px solid #292b2e;flex:none;justify-content:space-between;align-items:center;gap:12px;height:43px;padding:0 15px;font-size:11px;display:flex}.SingleComponentDemo-module__tKsJQq__canvasHeader>div:first-child{align-items:center;gap:8px;display:flex}.SingleComponentDemo-module__tKsJQq__canvasHeader strong{color:#e7e9ea;font-size:12px}.SingleComponentDemo-module__tKsJQq__componentLink{color:var(--accent);font-size:15px}.SingleComponentDemo-module__tKsJQq__canvasSize{color:#777d82}.SingleComponentDemo-module__tKsJQq__canvasActions{color:#858b90;align-items:center;gap:10px;display:flex}.SingleComponentDemo-module__tKsJQq__canvasActions>span:first-of-type{color:var(--accent)}.SingleComponentDemo-module__tKsJQq__exploreAction{color:#e4e8e7;font:inherit;background:#222426;border:1px solid #343639;border-radius:6px;align-items:center;gap:6px;padding:6px 9px;display:inline-flex}.SingleComponentDemo-module__tKsJQq__exploreAction svg{color:var(--accent)}.SingleComponentDemo-module__tKsJQq__toolbar{color:#b7bbbe;background:#1d1e20;border:1px solid #343639;border-radius:7px;flex:none;align-self:center;align-items:center;gap:2px;height:34px;margin:5px 0 4px;padding:2px;font-size:10px;display:inline-flex}.SingleComponentDemo-module__tKsJQq__toolbar>span,.SingleComponentDemo-module__tKsJQq__toolbar>button{min-height:27px;color:inherit;font:inherit;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:5px;align-items:center;gap:6px;padding:0 8px;display:inline-flex}.SingleComponentDemo-module__tKsJQq__toolbar svg{fill:none;stroke:currentColor;stroke-width:1.3px;width:15px;height:15px;color:var(--accent)}.SingleComponentDemo-module__tKsJQq__toolbar .SingleComponentDemo-module__tKsJQq__activeTool{color:#f0f2f2;background:#202426;border-color:#0cb994}.SingleComponentDemo-module__tKsJQq__stage{background:radial-gradient(at 50% 42%,#202123 0,#151618 68%);flex:1;place-items:center;min-height:0;padding:16px;display:grid;position:relative;overflow:hidden}.SingleComponentDemo-module__tKsJQq__previewCard{z-index:1;color:#1e2022;background:#fff;border:1px solid #e5e6e8;border-radius:12px;width:min(365px,62%);position:relative;overflow:hidden;box-shadow:0 20px 48px #0005}.SingleComponentDemo-module__tKsJQq__photo{aspect-ratio:1.17;background:#e5e8e7;position:relative;overflow:hidden}.SingleComponentDemo-module__tKsJQq__photo img{object-fit:cover;object-position:center 46%;width:100%;height:100%}.SingleComponentDemo-module__tKsJQq__superhost{color:#00a889;background:#fff;border-radius:20px;padding:6px 9px;font-size:11px;font-weight:650;position:absolute;top:12px;left:12px;box-shadow:0 2px 8px #0002}.SingleComponentDemo-module__tKsJQq__heart{color:#3a3b3d;background:#fff;border-radius:50%;place-items:center;width:30px;height:30px;font-size:23px;line-height:1;display:grid;position:absolute;top:11px;right:11px;box-shadow:0 2px 8px #0002}.SingleComponentDemo-module__tKsJQq__cardDetails{padding:12px 14px 15px}.SingleComponentDemo-module__tKsJQq__cardHeading{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.SingleComponentDemo-module__tKsJQq__cardHeading strong{font-size:15px;font-weight:650}.SingleComponentDemo-module__tKsJQq__cardHeading span{flex:none;font-size:11px}.SingleComponentDemo-module__tKsJQq__cardHeading b{color:#e4a800;font-size:13px}.SingleComponentDemo-module__tKsJQq__cardDetails>p{color:#7b8084;margin:4px 0 12px;font-size:12px}.SingleComponentDemo-module__tKsJQq__price{align-items:baseline;gap:4px;display:flex}.SingleComponentDemo-module__tKsJQq__price strong{font-size:17px}.SingleComponentDemo-module__tKsJQq__price span{color:#73787d;font-size:11px}.SingleComponentDemo-module__tKsJQq__price small{color:#777c80;margin-left:auto;font-size:10px}.SingleComponentDemo-module__tKsJQq__controls{z-index:4;opacity:0;visibility:hidden;background:#202123;border:1px solid #393b3e;border-radius:10px;width:min(336px,58%);padding:8px 10px 10px;transition:opacity .24s,transform .24s,visibility .24s;position:absolute;top:10px;right:12px;transform:translateY(-8px)scale(.985);box-shadow:0 16px 48px #0009}.SingleComponentDemo-module__tKsJQq__controls[data-open=true]{opacity:1;visibility:visible;transform:translateY(0)scale(1)}.SingleComponentDemo-module__tKsJQq__popoverHeader{color:#e7e9ea;border-bottom:1px solid #36383b;justify-content:space-between;align-items:center;height:32px;padding:0 2px 5px;font-size:13px;display:flex}.SingleComponentDemo-module__tKsJQq__popoverActions{align-items:center;gap:11px;display:flex}.SingleComponentDemo-module__tKsJQq__popoverActions span{color:#92989d;font:inherit;align-items:center;gap:5px;padding:3px;font-size:10px;display:inline-flex}.SingleComponentDemo-module__tKsJQq__popoverActions svg{fill:none;stroke:currentColor;stroke-width:1.4px;width:14px;height:14px}.SingleComponentDemo-module__tKsJQq__componentMeta{background:#252629;border:1px solid #35373a;border-radius:7px;align-items:center;gap:9px;margin:9px 0;padding:8px;display:flex}.SingleComponentDemo-module__tKsJQq__linkIcon{width:36px;height:36px;color:var(--accent);background:#303235;border-radius:6px;flex:none;place-items:center;display:grid}.SingleComponentDemo-module__tKsJQq__linkIcon svg{fill:none;stroke:currentColor;stroke-width:1.5px}.SingleComponentDemo-module__tKsJQq__componentMeta strong,.SingleComponentDemo-module__tKsJQq__componentMeta small{display:block}.SingleComponentDemo-module__tKsJQq__componentMeta strong{color:#e7e9ea;font-size:12px}.SingleComponentDemo-module__tKsJQq__componentMeta small{color:#858b90;margin-top:2px;font-size:10px}.SingleComponentDemo-module__tKsJQq__controlField{color:#a5aaad;margin-top:8px;font-size:11px;font-weight:550;display:block}.SingleComponentDemo-module__tKsJQq__controlField>span{color:#eceeef;background:#292a2d;border:1px solid #3a3c3f;border-radius:5px;margin-top:4px;padding:8px 10px;font-size:12px;font-weight:400;display:block}.SingleComponentDemo-module__tKsJQq__booleanField{color:#a5aaad;justify-content:space-between;align-items:center;margin-top:9px;font-size:11px;font-weight:550;display:flex}.SingleComponentDemo-module__tKsJQq__propCheckbox{background:#292a2d;border:1px solid #55595d;border-radius:3px;flex:none;place-items:center;width:16px;height:16px;margin:0 1px 0 8px;display:grid;position:relative}.SingleComponentDemo-module__tKsJQq__propCheckbox[data-checked=true]{background:#08b48e;border-color:#08b48e}.SingleComponentDemo-module__tKsJQq__propCheckbox[data-checked=true]:after{content:"";border-bottom:2px solid #12342b;border-right:2px solid #12342b;width:4px;height:8px;transform:translateY(-1px)rotate(45deg)}.SingleComponentDemo-module__tKsJQq__codeDrawer{z-index:3;background:#1d1e20;border:1px solid #37393c;border-radius:9px 9px 0 0;height:min(320px,54%);min-height:190px;transition:transform .65s cubic-bezier(.2,.8,.2,1);position:absolute;bottom:0;left:12px;right:12px;overflow:hidden;transform:translateY(calc(100% - 34px));box-shadow:0 -12px 32px #0006}.SingleComponentDemo-module__tKsJQq__codeDrawer[data-open=true]{transform:translateY(0)}.SingleComponentDemo-module__tKsJQq__codeHeader{color:#c0c4c6;background:#26272a;border-bottom:1px solid #333538;justify-content:space-between;align-items:center;height:34px;padding:0 12px;font-size:11px;display:flex}.SingleComponentDemo-module__tKsJQq__codeColumns{grid-template-columns:1.1fr .9fr;height:calc(100% - 34px);display:grid}.SingleComponentDemo-module__tKsJQq__codeColumns pre{color:#d7d9da;white-space:nowrap;margin:0;padding:10px 12px;font:10px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;overflow:hidden}.SingleComponentDemo-module__tKsJQq__codeColumns code{font:inherit;display:block}.SingleComponentDemo-module__tKsJQq__codeLine{align-items:center;min-width:max-content;height:1.65em;display:flex}.SingleComponentDemo-module__tKsJQq__lineNumber{color:#666c71;-webkit-user-select:none;user-select:none;flex:none;width:22px;display:inline-block}.SingleComponentDemo-module__tKsJQq__codeContent{white-space:pre;display:block}.SingleComponentDemo-module__tKsJQq__tokenKeyword{color:#c3e88d}.SingleComponentDemo-module__tKsJQq__tokenFunction,.SingleComponentDemo-module__tKsJQq__tokenProperty{color:#82aaff}.SingleComponentDemo-module__tKsJQq__tokenVariable,.SingleComponentDemo-module__tKsJQq__tokenNumber{color:#f78c6c}.SingleComponentDemo-module__tKsJQq__tokenTag,.SingleComponentDemo-module__tKsJQq__tokenPunctuation,.SingleComponentDemo-module__tKsJQq__tokenOperator{color:#89ddff}.SingleComponentDemo-module__tKsJQq__tokenAttribute,.SingleComponentDemo-module__tKsJQq__tokenSelector{color:#ffcb6b}.SingleComponentDemo-module__tKsJQq__tokenString,.SingleComponentDemo-module__tKsJQq__tokenValue{color:#c3e88d}.SingleComponentDemo-module__tKsJQq__codeColumns pre+pre{border-left:1px solid #333538}.SingleComponentDemo-module__tKsJQq__chat{background:#191a1c;border-left:1px solid #292b2e;flex-direction:column;min-width:0;display:flex;position:relative}.SingleComponentDemo-module__tKsJQq__chatTabs{color:#92989d;border-bottom:1px solid #2b2d30;flex:none;align-items:center;gap:20px;height:43px;padding:0 14px;font-size:11px;display:flex;position:relative}.SingleComponentDemo-module__tKsJQq__chatTabs strong{border-bottom:2px solid var(--accent);color:#e7e9ea;align-self:stretch;align-items:center;display:flex}.SingleComponentDemo-module__tKsJQq__chatTabs i{border:1px solid #888e92;border-radius:2px;width:13px;height:13px;margin-left:auto}.SingleComponentDemo-module__tKsJQq__newChat{color:#c6c9cb;border-bottom:1px solid #2d2f32;align-items:center;gap:7px;margin:10px 11px 0;padding:8px;font-size:10px;display:flex}.SingleComponentDemo-module__tKsJQq__newChat svg{fill:none;width:15px;height:15px;stroke:var(--accent);stroke-width:1.5px}.SingleComponentDemo-module__tKsJQq__newChat>span{color:#73797e;margin-left:auto}.SingleComponentDemo-module__tKsJQq__chatContent{flex-direction:column;flex:1;gap:11px;padding:12px;display:flex;overflow:hidden}.SingleComponentDemo-module__tKsJQq__chatUser{color:#e3e6e7;opacity:0;background:#2a2c2f;border:1px solid #3a3c3f;border-radius:9px 9px 2px;align-self:flex-end;max-width:95%;padding:9px 10px;font-size:10px;line-height:1.55;transition:opacity .3s,transform .3s;transform:translateY(6px)}.SingleComponentDemo-module__tKsJQq__chatUser[data-visible=true],.SingleComponentDemo-module__tKsJQq__chatAgent[data-visible=true]{opacity:1;transform:translateY(0)}.SingleComponentDemo-module__tKsJQq__chatAgent{color:#c6c9cb;opacity:0;align-items:flex-start;gap:8px;padding:4px 1px;font-size:10px;line-height:1.55;transition:opacity .3s,transform .3s;display:flex;transform:translateY(6px)}.SingleComponentDemo-module__tKsJQq__agentMark{color:#d7dbdc;border:1px solid #343639;border-radius:50%;flex:none;place-items:center;width:22px;height:22px;display:grid;overflow:hidden}.SingleComponentDemo-module__tKsJQq__agentMark img{width:16px;height:16px}.SingleComponentDemo-module__tKsJQq__chatAgent strong{color:#e6e8e9;font-size:10px}.SingleComponentDemo-module__tKsJQq__chatAgent p{color:#a7adb0;margin:3px 0 0}.SingleComponentDemo-module__tKsJQq__chatAgent code{color:#68d6b9;font:inherit}.SingleComponentDemo-module__tKsJQq__chatComposer{color:var(--accent);background:#242528;border:1px solid #36383b;border-radius:7px;align-items:center;gap:8px;margin:0 10px 10px;padding:10px 9px;font-size:13px;display:flex}.SingleComponentDemo-module__tKsJQq__chatComposer small{color:#767c81;flex:1;font-size:10px}.SingleComponentDemo-module__tKsJQq__chatComposer span:last-child{color:#0e211c;background:#159d82;border-radius:5px;place-items:center;width:20px;height:20px;font-size:12px;display:grid}@media (max-width:1100px){.SingleComponentDemo-module__tKsJQq__workArea{grid-template-columns:44px minmax(0,1fr) 260px}.SingleComponentDemo-module__tKsJQq__fileTree{display:none}.SingleComponentDemo-module__tKsJQq__rail{border-right:0}.SingleComponentDemo-module__tKsJQq__assigned{display:none}.SingleComponentDemo-module__tKsJQq__previewCard{width:min(355px,72%)}}@media (max-width:760px){.SingleComponentDemo-module__tKsJQq__demo{border-radius:10px}.SingleComponentDemo-module__tKsJQq__application{height:auto;min-height:0}.SingleComponentDemo-module__tKsJQq__appHeader{gap:9px;height:45px;padding:0 88px 0 10px}.SingleComponentDemo-module__tKsJQq__traffic{gap:4px}.SingleComponentDemo-module__tKsJQq__traffic i{width:8px;height:8px}.SingleComponentDemo-module__tKsJQq__project{padding:5px;font-size:10px}.SingleComponentDemo-module__tKsJQq__project .SingleComponentDemo-module__tKsJQq__hexbyMark{width:16px;height:18px}.SingleComponentDemo-module__tKsJQq__search,.SingleComponentDemo-module__tKsJQq__headerRight,.SingleComponentDemo-module__tKsJQq__avatar{display:none}.SingleComponentDemo-module__tKsJQq__ship{margin-left:auto;padding:6px 8px;font-size:10px}.SingleComponentDemo-module__tKsJQq__motionButton{height:26px;min-height:26px;padding:0 7px;font-size:9px;top:8px;right:8px}.SingleComponentDemo-module__tKsJQq__workArea{grid-template-columns:minmax(0,1fr);height:auto;display:grid}.SingleComponentDemo-module__tKsJQq__explorer{display:none}.SingleComponentDemo-module__tKsJQq__canvas{min-height:510px}.SingleComponentDemo-module__tKsJQq__canvasHeader{height:40px;padding:0 12px}.SingleComponentDemo-module__tKsJQq__canvasSize{display:none}.SingleComponentDemo-module__tKsJQq__canvasActions{gap:7px;font-size:9px}.SingleComponentDemo-module__tKsJQq__exploreAction{padding:5px 6px;font-size:9px}.SingleComponentDemo-module__tKsJQq__toolbar{justify-content:flex-start;max-width:calc(100% - 14px);height:34px;padding:2px;font-size:9px;overflow-x:auto}.SingleComponentDemo-module__tKsJQq__toolbar>span,.SingleComponentDemo-module__tKsJQq__toolbar>button{min-height:27px;padding:0 6px}.SingleComponentDemo-module__tKsJQq__stage{min-height:428px;padding:12px}.SingleComponentDemo-module__tKsJQq__previewCard{width:min(330px,82%)}.SingleComponentDemo-module__tKsJQq__controls{width:min(282px,100% - 14px);padding:9px;top:7px;right:7px}.SingleComponentDemo-module__tKsJQq__codeDrawer{height:190px;min-height:150px;left:7px;right:7px}.SingleComponentDemo-module__tKsJQq__codeColumns pre{padding:8px;font-size:8px}.SingleComponentDemo-module__tKsJQq__chat{border-top:1px solid #292b2e;border-left:0;min-height:180px}.SingleComponentDemo-module__tKsJQq__chatTabs{height:38px}.SingleComponentDemo-module__tKsJQq__chatContent{min-height:85px}.SingleComponentDemo-module__tKsJQq__chatComposer{margin-top:auto}}@media (prefers-reduced-motion:reduce){.SingleComponentDemo-module__tKsJQq__demo[data-reduced-motion=true] .SingleComponentDemo-module__tKsJQq__chatUser,.SingleComponentDemo-module__tKsJQq__demo[data-reduced-motion=true] .SingleComponentDemo-module__tKsJQq__chatAgent{opacity:1;transform:none}.SingleComponentDemo-module__tKsJQq__demo[data-reduced-motion=true] .SingleComponentDemo-module__tKsJQq__controls{opacity:0;visibility:hidden}.SingleComponentDemo-module__tKsJQq__demo[data-reduced-motion=true] .SingleComponentDemo-module__tKsJQq__codeDrawer{transform:translateY(0)}.SingleComponentDemo-module__tKsJQq__motionButton,.SingleComponentDemo-module__tKsJQq__controls,.SingleComponentDemo-module__tKsJQq__codeDrawer,.SingleComponentDemo-module__tKsJQq__chatUser,.SingleComponentDemo-module__tKsJQq__chatAgent{transition:none}}
