From bf2a11853256c40edbf6706fdda83787c904d8e2 Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 17:30:37 +0530 Subject: [PATCH 01/13] feat: Add searchable FileDropdown next to Breadcrumbs --- src/components/FileDropdown.tsx | 194 +++++++++++++++++++++++++ src/components/WorkspaceCodeEditor.tsx | 13 +- 2 files changed, 206 insertions(+), 1 deletion(-) create mode 100644 src/components/FileDropdown.tsx diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx new file mode 100644 index 0000000..4cc248b --- /dev/null +++ b/src/components/FileDropdown.tsx @@ -0,0 +1,194 @@ +import { ChevronsUpDown, Search, X } from "lucide-react" +import { Popover as PopoverPrimitive } from "radix-ui" +import { useEffect, useMemo, useRef, useState } from "react" +import { + getFileIconClassName, + getFileIconComponent, +} from "../utils/getFileIcon" +import type { EditorFile } from "./WorkspaceCodeEditor" + +export function FileDropdown({ + files, + currentFile, + onFileSelect, +}: { + files: EditorFile[] + currentFile: string | null + onFileSelect: (path: string) => void +}) { + const [open, setOpen] = useState(false) + const [searchQuery, setSearchQuery] = useState("") + const [focusedIndex, setFocusedIndex] = useState(-1) + const inputRef = useRef(null) + const listRef = useRef(null) + const anchorRef = useRef(null) + + const filteredFiles = useMemo(() => { + const query = searchQuery.trim().toLocaleLowerCase() + return query + ? files.filter((file) => file.path.toLocaleLowerCase().includes(query)) + : files + }, [files, searchQuery]) + + useEffect(() => { + if (open) { + setSearchQuery("") + setFocusedIndex(-1) + requestAnimationFrame(() => inputRef.current?.focus()) + } + }, [open]) + + useEffect(() => { + if (focusedIndex < 0 || !listRef.current) return + const items = listRef.current.querySelectorAll("[data-file-item]") + items[focusedIndex]?.scrollIntoView({ block: "nearest" }) + }, [focusedIndex]) + + const handleKeyDown = (e: React.KeyboardEvent) => { + switch (e.key) { + case "ArrowDown": + e.preventDefault() + setFocusedIndex((prev) => + prev < filteredFiles.length - 1 ? prev + 1 : 0, + ) + break + case "ArrowUp": + e.preventDefault() + setFocusedIndex((prev) => + prev > 0 ? prev - 1 : filteredFiles.length - 1, + ) + break + case "Enter": + e.preventDefault() + if (focusedIndex >= 0 && filteredFiles[focusedIndex]) { + onFileSelect(filteredFiles[focusedIndex].path) + setOpen(false) + } + break + case "Escape": + e.preventDefault() + setOpen(false) + break + } + } + + const displayName = currentFile + ? (currentFile.split("/").pop() ?? currentFile) + : "Select file" + + return ( + + +
+ {!open ? ( + + ) : ( +
+
+ )} +
+ + + e.preventDefault()} + onFocusOutside={(e) => { + if (anchorRef.current?.contains(e.target as Node)) { + e.preventDefault() + } + }} + onInteractOutside={(e) => { + if (anchorRef.current?.contains(e.target as Node)) { + e.preventDefault() + } + }} + > +
+ {filteredFiles.length > 0 ? ( + filteredFiles.map((file, index) => { + const fileName = file.path.split("/").pop() ?? file.path + const FileIcon = getFileIconComponent(fileName) + const iconClassName = getFileIconClassName(fileName) + const isActive = file.path === currentFile + const isFocused = index === focusedIndex + return ( + + ) + }) + ) : ( +
+ No files match “{searchQuery}” +
+ )} +
+ + + + ) +} diff --git a/src/components/WorkspaceCodeEditor.tsx b/src/components/WorkspaceCodeEditor.tsx index d540df0..8a48df3 100644 --- a/src/components/WorkspaceCodeEditor.tsx +++ b/src/components/WorkspaceCodeEditor.tsx @@ -1,5 +1,5 @@ import Editor, { type OnChange, type OnMount } from "@monaco-editor/react" -import { PanelRightClose } from "lucide-react" +import { ChevronsUpDown, PanelRightClose, Search, X } from "lucide-react" import * as monaco from "monaco-editor" import { forwardRef, @@ -36,6 +36,7 @@ import { type WorkspaceSearchMatch, } from "../utils/workspaceSearch" import { Breadcrumbs } from "./Breadcrumbs" +import { FileDropdown } from "./FileDropdown" import { FileSidebar } from "./FileSidebar" import { QuickOpen } from "./QuickOpen" import { WorkspaceSearch } from "./WorkspaceSearch" @@ -517,6 +518,16 @@ export const WorkspaceCodeEditor = forwardRef< )} +
+ +
+
Date: Sat, 18 Jul 2026 17:39:15 +0530 Subject: [PATCH 02/13] fix: Update icon imports for FileDropdown --- src/components/FileDropdown.tsx | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx index 4cc248b..4ec01c1 100644 --- a/src/components/FileDropdown.tsx +++ b/src/components/FileDropdown.tsx @@ -1,10 +1,7 @@ import { ChevronsUpDown, Search, X } from "lucide-react" import { Popover as PopoverPrimitive } from "radix-ui" import { useEffect, useMemo, useRef, useState } from "react" -import { - getFileIconClassName, - getFileIconComponent, -} from "../utils/getFileIcon" +import { getFileIconClassName, getFileIconComponent } from "../utils/icons" import type { EditorFile } from "./WorkspaceCodeEditor" export function FileDropdown({ From d43bced36266f52a3e43a6527318890160d0f9bb Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 17:42:00 +0530 Subject: [PATCH 03/13] refactor: Remove Breadcrumbs entirely --- src/components/Breadcrumbs.tsx | 554 ------------------------- src/components/WorkspaceCodeEditor.tsx | 14 +- 2 files changed, 1 insertion(+), 567 deletions(-) delete mode 100644 src/components/Breadcrumbs.tsx diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx deleted file mode 100644 index 3d58653..0000000 --- a/src/components/Breadcrumbs.tsx +++ /dev/null @@ -1,554 +0,0 @@ -import { ChevronRight, Folder } from "lucide-react" -import type * as monaco from "monaco-editor" -import type { KeyboardEvent, ReactNode, RefObject } from "react" -import { - createContext, - useContext, - useEffect, - useMemo, - useRef, - useState, -} from "react" -import { - type DocumentSymbol, - getDocumentSymbols, - isCodeFile, -} from "../monaco/monacoTypeScript" -import { - buildFileTree, - collectFiles, - type FileTreeNode, -} from "../utils/build-file-tree" -import { getDocumentSymbolPath } from "../utils/documentSymbolPath" -import { getFileIcon, getSymbolIcon } from "../utils/icons" -import { isHiddenFile } from "../utils/isHiddenFile" -import { fuzzyMatch } from "../utils/quickOpen" -import { Breadcrumb, BreadcrumbList } from "./ui/breadcrumb" -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuSub, - DropdownMenuSubContent, - DropdownMenuSubTrigger, - DropdownMenuTrigger, -} from "./ui/dropdown-menu" - -export type BreadcrumbsProps = { - editor: monaco.editor.IStandaloneCodeEditor | null - model: monaco.editor.ITextModel | null - filePath: string | null - files?: { path: string }[] - onFileSelect?: (path: string) => void -} - -const menuItemBaseClassName = - "gap-1.5 py-0.5 text-xs [&_svg:not([class*='size-'])]:size-3.5" - -const getMenuItemClassName = (isActive: boolean) => - `${menuItemBaseClassName} ${isActive ? "bg-slate-100" : ""}` - -/** Lets menu content close its enclosing breadcrumb dropdown. */ -const CloseMenuContext = createContext<() => void>(() => {}) - -function loadDocumentSymbols({ - model, - isActive, - setSymbols, -}: { - model: monaco.editor.ITextModel - isActive: () => boolean - setSymbols: (symbols: DocumentSymbol[]) => void -}) { - getDocumentSymbols(model) - .then((symbols) => { - if (isActive()) setSymbols(symbols) - }) - .catch((error) => { - console.warn("Failed to load document symbols", error) - }) -} - -function revealDocumentSymbol({ - editor, - symbol, -}: { - editor: monaco.editor.IStandaloneCodeEditor | null - symbol: DocumentSymbol -}) { - if (!editor) return - - const position = { - lineNumber: symbol.selectionRange.startLineNumber, - column: symbol.selectionRange.startColumn, - } - editor.revealPositionInCenter(position) - editor.setPosition(position) - editor.focus() -} - -export function Breadcrumbs({ - editor, - model, - filePath, - files, - onFileSelect, -}: BreadcrumbsProps) { - const [symbols, setSymbols] = useState([]) - const [cursor, setCursor] = useState(null) - - // Only code files have a TypeScript outline; other files (md, json, …) - // still get file-path breadcrumbs. - const hasSymbolOutline = isCodeFile(filePath) - - // Refetch the file outline whenever the active model or its content - // changes; the TS worker call is cheap since it reuses the language - // service's already-parsed source file. - useEffect(() => { - if (!editor || !model || !hasSymbolOutline) { - setSymbols([]) - setCursor(null) - return - } - - let isActive = true - const symbolLoadRequest = { - model, - isActive: () => isActive, - setSymbols, - } - loadDocumentSymbols(symbolLoadRequest) - setCursor(editor.getPosition()) - - const changeDisposable = model.onDidChangeContent(() => - loadDocumentSymbols(symbolLoadRequest), - ) - const cursorDisposable = editor.onDidChangeCursorPosition((event) => - setCursor(event.position), - ) - - return () => { - isActive = false - changeDisposable.dispose() - cursorDisposable.dispose() - } - }, [editor, model, hasSymbolOutline]) - - const symbolPath = useMemo( - () => - cursor - ? getDocumentSymbolPath(symbols, cursor.lineNumber, cursor.column) - : [], - [symbols, cursor], - ) - - const visiblePaths = useMemo( - () => - (files ?? []) - .map((file) => file.path) - .filter((path) => !isHiddenFile(path)), - [files], - ) - - // The current file is normally part of visiblePaths, so switching between - // visible files reuses the cached tree; only a hidden current file forces - // a rebuild that includes it. - const hiddenCurrentPath = - filePath && - isHiddenFile(filePath) && - files?.some((file) => file.path === filePath) - ? filePath - : null - - const fileTree = useMemo( - () => - buildFileTree( - hiddenCurrentPath ? [...visiblePaths, hiddenCurrentPath] : visiblePaths, - ), - [visiblePaths, hiddenCurrentPath], - ) - - // Sibling list per path depth, computed with a single downward walk so - // cursor-move re-renders don't re-walk the tree per segment. - const siblingsByDepth = useMemo(() => { - if (!filePath) return [] - const segments = filePath.split("/") - const lists: FileTreeNode[][] = [] - let nodes = fileTree - for (const segment of segments) { - lists.push(nodes) - nodes = nodes.find((node) => node.name === segment)?.children ?? [] - } - return lists - }, [fileTree, filePath]) - - if (!filePath) return null - - const pathSegments = filePath.split("/") - - return ( - - - {pathSegments.map((segment, index) => { - const isLast = index === pathSegments.length - 1 - const siblings = siblingsByDepth[index] ?? [] - const segmentPath = pathSegments.slice(0, index + 1).join("/") - return ( - 0 ? ( - - ) : undefined - } - > - {segment} - - ) - })} - {symbolPath.map((symbol, index) => { - const siblings = - index === 0 ? symbols : (symbolPath[index - 1]?.children ?? []) - return ( - revealDocumentSymbol({ editor, symbol })} - dropdown={ - siblings.length > 0 ? ( - - revealDocumentSymbol({ editor, symbol }) - } - /> - ) : undefined - } - > - {symbol.name} - - ) - })} - - - ) -} - -function FileLeafItem({ - node, - isHighlighted, - onFileSelect, -}: { - node: FileTreeNode - isHighlighted: boolean - onFileSelect: (path: string) => void -}) { - return ( - onFileSelect(node.path)} - className={getMenuItemClassName(isHighlighted)} - > - {getFileIcon(node.name)} - {node.name} - {node.path.includes("/") && ( - - {node.path.slice(0, node.path.lastIndexOf("/"))} - - )} - - ) -} - -function FileTreeMenu({ - nodes, - currentPath, - onFileSelect, -}: { - nodes: FileTreeNode[] - currentPath: string - onFileSelect: (path: string) => void -}) { - const closeMenu = useContext(CloseMenuContext) - const [query, setQuery] = useState("") - const [selectedIndex, setSelectedIndex] = useState(0) - const inputRef = useRef(null) - const firstItemRef = useRef(null) - - // Radix focuses the menu content when it opens; grab focus afterwards so - // the user can type immediately. - useEffect(() => { - const frame = requestAnimationFrame(() => inputRef.current?.focus()) - return () => cancelAnimationFrame(frame) - }, []) - - const allFiles = useMemo(() => collectFiles(nodes), [nodes]) - - // Same fuzzy matching as the Quick Open palette, scoped to this subtree. - const matches = useMemo(() => { - const needle = query.trim() - if (!needle) return null - return allFiles - .map((node) => ({ node, match: fuzzyMatch(needle, node.path) })) - .filter((entry) => entry.match !== null) - .sort((a, b) => (b.match?.score ?? 0) - (a.match?.score ?? 0)) - .map((entry) => entry.node) - }, [allFiles, query]) - - const highlightedIndex = matches - ? Math.min(selectedIndex, matches.length - 1) - : 0 - - let menuItems: ReactNode - if (matches === null) { - menuItems = ( - - ) - } else if (matches.length === 0) { - menuItems = ( -
- No matching files -
- ) - } else { - menuItems = matches.map((node, index) => ( - - )) - } - - return ( - <> - { - setQuery(event.target.value) - setSelectedIndex(0) - }} - onKeyDown={(event) => - handleFileMenuKeyDown({ - event, - matches, - highlightedIndex, - firstItemRef, - setSelectedIndex, - onFileSelect, - closeMenu, - }) - } - placeholder="Search files…" - className="mb-1 w-full rounded border border-slate-200 bg-transparent px-1.5 py-0.5 font-mono text-xs outline-none placeholder:text-slate-400 focus:border-slate-300" - /> - {menuItems} - - ) -} - -function handleFileMenuKeyDown({ - event, - matches, - highlightedIndex, - firstItemRef, - setSelectedIndex, - onFileSelect, - closeMenu, -}: { - event: KeyboardEvent - matches: FileTreeNode[] | null - highlightedIndex: number - firstItemRef: RefObject - setSelectedIndex: (index: number) => void - onFileSelect: (path: string) => void - closeMenu: () => void -}) { - if (event.key === "Escape") return - - if (matches === null) { - if (event.key === "ArrowDown") { - firstItemRef.current?.focus() - event.preventDefault() - } - event.stopPropagation() - return - } - - if (event.key === "Enter") { - const file = matches[highlightedIndex] - if (file) { - onFileSelect(file.path) - closeMenu() - } - } else if (event.key === "ArrowDown") { - setSelectedIndex(Math.min(highlightedIndex + 1, matches.length - 1)) - } else if (event.key === "ArrowUp") { - setSelectedIndex(Math.max(highlightedIndex - 1, 0)) - } else { - event.stopPropagation() - return - } - - event.preventDefault() - event.stopPropagation() -} - -function FileTreeMenuItems({ - nodes, - currentPath, - onFileSelect, - firstItemRef, -}: { - nodes: FileTreeNode[] - currentPath: string - onFileSelect: (path: string) => void - firstItemRef?: React.RefObject -}) { - return ( - <> - {nodes.map((node, index) => - node.children ? ( - - - - {node.name} - - - - - - ) : ( - onFileSelect(node.path)} - className={getMenuItemClassName(node.path === currentPath)} - > - {getFileIcon(node.name)} - {node.name} - - ), - )} - - ) -} - -function SymbolMenuItems({ - symbols, - currentSymbol, - onReveal, -}: { - symbols: DocumentSymbol[] - currentSymbol: DocumentSymbol - onReveal: (symbol: DocumentSymbol) => void -}) { - return ( - <> - {symbols.map((symbol) => ( - onReveal(symbol)} - className={getMenuItemClassName(symbol === currentSymbol)} - > - {getSymbolIcon(symbol.kind)} - {symbol.name} - - ))} - - ) -} - -function BreadcrumbSegment({ - children, - icon, - onClick, - dropdown, - isLast, -}: { - children: ReactNode - icon?: ReactNode - onClick?: () => void - dropdown?: ReactNode - isLast: boolean -}) { - const [open, setOpen] = useState(false) - const label = ( - <> - {icon} - {children} - - ) - const labelClassName = `flex items-center gap-1 rounded px-1 py-0.5 font-mono ${ - isLast ? "text-slate-900" : "text-slate-500" - }` - - let content: ReactNode - if (dropdown) { - content = ( - - - - - - setOpen(false)}> - {dropdown} - - - - ) - } else if (onClick) { - content = ( - - ) - } else { - content = {label} - } - - return ( -
  • - {content} - {!isLast && ( -
    • - ) -} diff --git a/src/components/WorkspaceCodeEditor.tsx b/src/components/WorkspaceCodeEditor.tsx index 8a48df3..4d502ca 100644 --- a/src/components/WorkspaceCodeEditor.tsx +++ b/src/components/WorkspaceCodeEditor.tsx @@ -35,7 +35,7 @@ import { createWorkspaceReplacementEdits, type WorkspaceSearchMatch, } from "../utils/workspaceSearch" -import { Breadcrumbs } from "./Breadcrumbs" + import { FileDropdown } from "./FileDropdown" import { FileSidebar } from "./FileSidebar" import { QuickOpen } from "./QuickOpen" @@ -527,18 +527,6 @@ export const WorkspaceCodeEditor = forwardRef< onFileSelect={onFileSelect} />
    -
    -
    )} From 0d935aee37643614ea641d9dcd22dbe02433263d Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 17:49:59 +0530 Subject: [PATCH 04/13] style: Add margin and clean up top bar layout --- src/components/WorkspaceCodeEditor.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/WorkspaceCodeEditor.tsx b/src/components/WorkspaceCodeEditor.tsx index 4d502ca..ece6171 100644 --- a/src/components/WorkspaceCodeEditor.tsx +++ b/src/components/WorkspaceCodeEditor.tsx @@ -501,7 +501,7 @@ export const WorkspaceCodeEditor = forwardRef<
    {(showSidebar || currentFile) && ( -
    +
    {showSidebar && ( )} -
    +
    Date: Sat, 18 Jul 2026 17:52:19 +0530 Subject: [PATCH 05/13] feat: Add OS-aware keyboard shortcut hint to dropdown --- src/components/FileDropdown.tsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx index 4ec01c1..a441263 100644 --- a/src/components/FileDropdown.tsx +++ b/src/components/FileDropdown.tsx @@ -20,6 +20,12 @@ export function FileDropdown({ const listRef = useRef(null) const anchorRef = useRef(null) + const [isMac, setIsMac] = useState(true) + + useEffect(() => { + setIsMac(navigator.platform.toUpperCase().indexOf("MAC") >= 0) + }, []) + const filteredFiles = useMemo(() => { const query = searchQuery.trim().toLocaleLowerCase() return query @@ -91,7 +97,12 @@ export function FileDropdown({ {displayName}
    - +
    + + {isMac ? "⌘" : "Ctrl"}P + + +
    ) : (
    From cf1e2078e250ae1c85775fc98ab16d2c273d4383 Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 17:54:48 +0530 Subject: [PATCH 06/13] style: Prevent dropdown search input from scaling outwards on focus --- src/components/FileDropdown.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx index a441263..ef3f1a5 100644 --- a/src/components/FileDropdown.tsx +++ b/src/components/FileDropdown.tsx @@ -122,7 +122,7 @@ export function FileDropdown({ setFocusedIndex(0) }} onKeyDown={handleKeyDown} - className="h-full w-full rounded-md border border-blue-500 bg-white pl-7 pr-7 text-xs text-slate-700 outline-none shadow-sm ring-1 ring-blue-500" + className="h-full w-full rounded-md border border-blue-500 bg-white pl-7 pr-7 text-xs text-slate-700 outline-none shadow-sm ring-1 ring-inset ring-blue-500" /> {searchQuery && (
    )}
    - - - e.preventDefault()} - onFocusOutside={(e) => { - if (anchorRef.current?.contains(e.target as Node)) { - e.preventDefault() - } - }} - onInteractOutside={(e) => { - if (anchorRef.current?.contains(e.target as Node)) { - e.preventDefault() - } - }} - > -
    - {filteredFiles.length > 0 ? ( + + e.preventDefault()} + onFocusOutside={(e) => { + if (triggerRef.current?.contains(e.target as Node)) { + e.preventDefault() + } + }} + onInteractOutside={(e) => { + if (triggerRef.current?.contains(e.target as Node)) { + e.preventDefault() + } + }} + > +
    + {isSearching ? ( + filteredFiles.length > 0 ? ( filteredFiles.map((file, index) => { const fileName = file.path.split("/").pop() ?? file.path const FileIcon = getFileIconComponent(fileName) const iconClassName = getFileIconClassName(fileName) - const isActive = file.path === currentFile const isFocused = index === focusedIndex return ( - + ) }) ) : (
    No files match “{searchQuery}”
    - )} -
    - - - + ) + ) : ( + + )} +
    + + ) } From 2ed5fa2cf6adb37e304147c751be9f89d93b4d5d Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 18:10:05 +0530 Subject: [PATCH 08/13] fix: Resolve TypeScript errors in FileDropdown component --- src/components/FileDropdown.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx index 327882b..05fbfc5 100644 --- a/src/components/FileDropdown.tsx +++ b/src/components/FileDropdown.tsx @@ -232,13 +232,14 @@ export function FileDropdown({ align="start" sideOffset={4} className="z-50 w-[var(--radix-dropdown-menu-trigger-width)] max-h-64 overflow-y-auto p-1" - onOpenAutoFocus={(e) => e.preventDefault()} - onFocusOutside={(e) => { + // @ts-ignore - Radix DropdownMenu types sometimes omit this, but the underlying primitive uses it to manage focus + onOpenAutoFocus={(e: any) => e.preventDefault()} + onFocusOutside={(e: any) => { if (triggerRef.current?.contains(e.target as Node)) { e.preventDefault() } }} - onInteractOutside={(e) => { + onInteractOutside={(e: any) => { if (triggerRef.current?.contains(e.target as Node)) { e.preventDefault() } From 877bc42ba1577df54142f0605a229dd067e84ede Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 18:11:12 +0530 Subject: [PATCH 09/13] up --- src/styles.compiled.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles.compiled.css b/src/styles.compiled.css index 956fcbd..d4eec94 100644 --- a/src/styles.compiled.css +++ b/src/styles.compiled.css @@ -1,2 +1,2 @@ /* Generated by `bun run build:css` — do not edit. */ -@layer tscircuit-monaco-code-editor{*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Geist Variable,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}*{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}body,html{font-family:Geist Variable,sans-serif}body{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.left-1\/2{left:50%}.right-2{right:.5rem}.right-3{right:.75rem}.top-\[12vh\]{top:12vh}.top-\[7vh\]{top:7vh}.z-50{z-index:50}.z-\[100\]{z-index:100}.m-0{margin:0}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem}.mb-1,.my-1{margin-bottom:.25rem}.mb-3{margin-bottom:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-\[2px\]{margin-left:2px}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.contents{display:contents}.hidden{display:none}.size-3\.5{width:.875rem;height:.875rem}.size-4{width:1rem;height:1rem}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[48px\]{height:48px}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-full{height:100%}.h-px{height:1px}.max-h-72{max-height:18rem}.max-h-96{max-height:24rem}.max-h-\[min\(32rem\2c 76vh\)\]{max-height:min(32rem,76vh)}.max-h-\[min\(42rem\2c 86vh\)\]{max-height:min(42rem,86vh)}.max-h-\[var\(--radix-dropdown-menu-content-available-height\)\]{max-height:var(--radix-dropdown-menu-content-available-height)}.min-h-0{min-height:0}.min-h-24{min-height:6rem}.min-h-40{min-height:10rem}.min-h-\[30px\]{min-height:30px}.w-0{width:0}.w-10{width:2.5rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-56{width:14rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-9{width:2.25rem}.w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.w-\[var\(--radix-dropdown-menu-trigger-width\)\]{width:var(--radix-dropdown-menu-trigger-width)}.w-auto{width:auto}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\[10rem\]{min-width:10rem}.min-w-\[8rem\]{min-width:8rem}.min-w-\[96px\]{min-width:96px}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.max-w-3xl{max-width:48rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.origin-\[var\(--radix-dropdown-menu-content-transform-origin\)\]{transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.scale-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-90{--tw-scale-x:.9;--tw-scale-y:.9}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-default{cursor:default}.cursor-move{cursor:move}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.scroll-my-1{scroll-margin-top:.25rem;scroll-margin-bottom:.25rem}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.truncate{overflow:hidden;text-overflow:ellipsis}.truncate,.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-sm{border-radius:calc(var(--radius) - 4px)}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-0{border-width:0}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-r-0{border-right-width:0}.border-t{border-top-width:1px}.border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.bg-amber-200{--tw-bg-opacity:1;background-color:rgb(253 230 138/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity,1))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-slate-50\/70{background-color:rgba(248,250,252,.7)}.bg-slate-900{--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.bg-slate-950\/20{background-color:rgba(2,6,23,.2)}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-0{padding:0}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.px-0{padding-left:0;padding-right:0}.px-0\.5{padding-left:.125rem;padding-right:.125rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-1{padding-bottom:.25rem}.pl-1{padding-left:.25rem}.pl-1\.5{padding-left:.375rem}.pl-2{padding-left:.5rem}.pl-6{padding-left:1.5rem}.pr-8{padding-right:2rem}.pt-0{padding-top:0}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:Geist Variable,sans-serif}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.text-\[9px\]{font-size:9px}.text-base{font-size:1rem;line-height:1.5rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.tracking-wide{letter-spacing:.025em}.tracking-widest{letter-spacing:.1em}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22/var(--tw-text-opacity,1))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-sky-600{--tw-text-opacity:1;color:rgb(2 132 199/var(--tw-text-opacity,1))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity,1))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.text-slate-50{--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.text-slate-900\/50{color:rgba(15,23,42,.5)}.text-slate-950{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-yellow-500{--tw-text-opacity:1;color:rgb(234 179 8/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.decoration-slate-300{text-decoration-color:#cbd5e1}.decoration-slate-400{text-decoration-color:#94a3b8}.underline-offset-2{text-underline-offset:2px}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-50{opacity:.5}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}.shadow-none,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-slate-950\/20{--tw-shadow-color:rgba(2,6,23,.2);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-offset-white{--tw-ring-offset-color:#fff}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-\[1px\]{--tw-backdrop-blur:blur(1px);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition-\[width\2c opacity\]{transition-property:width,opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}.duration-100{animation-duration:.1s}.duration-200{animation-duration:.2s}.duration-300{animation-duration:.3s}.ease-in-out{animation-timing-function:cubic-bezier(.4,0,.2,1)}:root{--radius:0.625rem;--background:#fff;--foreground:#0f172a}.dark{--background:#0f172a;--foreground:#f8fafc}.file\:inline-flex::file-selector-button{display:inline-flex}.file\:h-6::file-selector-button{height:1.5rem}.file\:border-0::file-selector-button{border-width:0}.file\:bg-transparent::file-selector-button{background-color:transparent}.file\:text-sm::file-selector-button{font-size:.875rem;line-height:1.25rem}.file\:font-medium::file-selector-button{font-weight:500}.file\:text-slate-900::file-selector-button{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.placeholder\:text-slate-400::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.placeholder\:text-slate-400::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.placeholder\:text-slate-500::-moz-placeholder{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.placeholder\:text-slate-500::placeholder{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\:bg-red-500\/90:hover{background-color:rgba(239,68,68,.9)}.hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\:bg-slate-100\/80:hover{background-color:rgba(241,245,249,.8)}.hover\:bg-slate-200\/70:hover{background-color:rgba(226,232,240,.7)}.hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.hover\:bg-slate-900\/90:hover{background-color:rgba(15,23,42,.9)}.hover\:text-blue-700:hover{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity,1))}.hover\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.hover\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.hover\:text-slate-950:hover{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.focus\:border-slate-300:focus{--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.focus\:bg-slate-100:focus{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus\:text-slate-900:focus{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}.focus\:ring-slate-950:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(2 6 23/var(--tw-ring-opacity,1))}.focus-visible\:border-slate-400:focus-visible{--tw-border-opacity:1;border-color:rgb(148 163 184/var(--tw-border-opacity,1))}.focus-visible\:border-transparent:focus-visible{border-color:transparent}.focus-visible\:bg-slate-100:focus-visible{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-0:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-inset:focus-visible{--tw-ring-inset:inset}.focus-visible\:ring-red-500:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-200:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(226 232 240/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-400:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(148 163 184/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-950:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(2 6 23/var(--tw-ring-opacity,1))}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-slate-100:disabled{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:opacity-100{opacity:1}.group\/dropdown-menu-item:focus .group-focus\/dropdown-menu-item\:text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:0.25rem}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom],.data-\[side\=left\]\:-translate-x-1[data-side=left]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:-0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right],.data-\[side\=top\]\:-translate-y-1[data-side=top]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:-0.25rem}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out}.data-\[state\=closed\]\:overflow-hidden[data-state=closed]{overflow:hidden}.data-\[state\=open\]\:bg-slate-100[data-state=open]{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.data-\[inset\=true\]\:pl-7[data-inset=true]{padding-left:1.75rem}.data-\[state\=open\]\:text-slate-900[data-state=open]{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.data-\[variant\=destructive\]\:text-red-600[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[state\=open\]\:animate-in[data-state=open]{animation-name:enter;animation-duration:.15s;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation-name:exit;animation-duration:.15s;--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial}.data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-0.5rem}.data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:0.5rem}.data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:-0.5rem}.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:0.5rem}.data-\[variant\=destructive\]\:focus\:bg-red-50:focus[data-variant=destructive]{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.data-\[variant\=destructive\]\:focus\:text-red-600:focus[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.dark\:border-slate-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity,1))}.dark\:bg-red-900:is(.dark *){--tw-bg-opacity:1;background-color:rgb(127 29 29/var(--tw-bg-opacity,1))}.dark\:bg-slate-50:is(.dark *){--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.dark\:bg-slate-600:is(.dark *){--tw-bg-opacity:1;background-color:rgb(71 85 105/var(--tw-bg-opacity,1))}.dark\:bg-slate-700:is(.dark *){--tw-bg-opacity:1;background-color:rgb(51 65 85/var(--tw-bg-opacity,1))}.dark\:bg-slate-800:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:bg-slate-950:is(.dark *){--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.dark\:text-slate-400:is(.dark *){--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:text-slate-50:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:text-slate-50\/50:is(.dark *){color:rgba(248,250,252,.5)}.dark\:text-slate-900:is(.dark *){--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.dark\:ring-offset-slate-950:is(.dark *){--tw-ring-offset-color:#020617}.dark\:file\:text-slate-50:is(.dark *)::file-selector-button{--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:placeholder\:text-slate-400:is(.dark *)::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:placeholder\:text-slate-400:is(.dark *)::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:hover\:bg-red-900\/90:hover:is(.dark *){background-color:rgba(127,29,29,.9)}.dark\:hover\:bg-slate-50\/90:hover:is(.dark *){background-color:rgba(248,250,252,.9)}.dark\:hover\:bg-slate-700\/50:hover:is(.dark *){background-color:rgba(51,65,85,.5)}.dark\:hover\:bg-slate-800:hover:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:hover\:bg-slate-800\/80:hover:is(.dark *){background-color:rgba(30,41,59,.8)}.dark\:hover\:text-slate-50:hover:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:focus\:bg-slate-800:focus:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:focus\:text-slate-50:focus:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:focus\:ring-slate-300:focus:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.dark\:focus-visible\:border-slate-600:focus-visible:is(.dark *){--tw-border-opacity:1;border-color:rgb(71 85 105/var(--tw-border-opacity,1))}.dark\:focus-visible\:ring-slate-300:focus-visible:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.dark\:focus-visible\:ring-slate-800:focus-visible:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(30 41 59/var(--tw-ring-opacity,1))}.dark\:disabled\:bg-slate-900:disabled:is(.dark *){--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.group\/dropdown-menu-item:focus .dark\:group-focus\/dropdown-menu-item\:text-slate-50:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:data-\[state\=open\]\:bg-slate-800[data-state=open]:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:data-\[state\=open\]\:text-slate-50[data-state=open]:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:data-\[variant\=destructive\]\:focus\:bg-red-950\/40:focus[data-variant=destructive]:is(.dark *){background-color:rgba(69,10,10,.4)}@media (min-width:640px){.sm\:gap-0\.5{gap:.125rem}.sm\:gap-2\.5{gap:.625rem}}@media (min-width:768px){.md\:text-sm{font-size:.875rem;line-height:1.25rem}}.\[\&\>span\]\:line-clamp-1>span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.\[\&\>svg\]\:h-3\.5>svg{height:.875rem}.\[\&\>svg\]\:w-3\.5>svg{width:.875rem}.first\:\[\&\[data-state\=open\]\>svg\]\:rotate-90[data-state=open]>svg:first-child{--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3\.5 svg:not([class*=size-]){width:.875rem;height:.875rem}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:1rem;height:1rem}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.data-\[variant\=destructive\]\:\[\&_svg\]\:text-red-600 svg[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}} +@layer tscircuit-monaco-code-editor{*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Geist Variable,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}*{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}body,html{font-family:Geist Variable,sans-serif}body{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.left-1\/2{left:50%}.left-2{left:.5rem}.right-1\.5{right:.375rem}.right-2{right:.5rem}.right-3{right:.75rem}.top-1\/2{top:50%}.top-\[12vh\]{top:12vh}.top-\[7vh\]{top:7vh}.z-50{z-index:50}.z-\[100\]{z-index:100}.m-0{margin:0}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem}.mb-1,.my-1{margin-bottom:.25rem}.mb-3{margin-bottom:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-\[2px\]{margin-left:2px}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.contents{display:contents}.hidden{display:none}.size-3\.5{width:.875rem;height:.875rem}.size-4{width:1rem;height:1rem}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[48px\]{height:48px}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-full{height:100%}.h-px{height:1px}.max-h-64{max-height:16rem}.max-h-72{max-height:18rem}.max-h-96{max-height:24rem}.max-h-\[min\(32rem\2c 76vh\)\]{max-height:min(32rem,76vh)}.max-h-\[min\(42rem\2c 86vh\)\]{max-height:min(42rem,86vh)}.max-h-\[var\(--radix-dropdown-menu-content-available-height\)\]{max-height:var(--radix-dropdown-menu-content-available-height)}.min-h-0{min-height:0}.min-h-24{min-height:6rem}.min-h-40{min-height:10rem}.min-h-\[36px\]{min-height:36px}.w-0{width:0}.w-10{width:2.5rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-32{width:8rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-56{width:14rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-9{width:2.25rem}.w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.w-\[var\(--radix-dropdown-menu-trigger-width\)\]{width:var(--radix-dropdown-menu-trigger-width)}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\[8rem\]{min-width:8rem}.min-w-\[96px\]{min-width:96px}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.max-w-3xl{max-width:48rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.origin-\[var\(--radix-dropdown-menu-content-transform-origin\)\]{transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%}.scale-90{--tw-scale-x:.9;--tw-scale-y:.9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.scroll-my-1{scroll-margin-top:.25rem;scroll-margin-bottom:.25rem}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.truncate{overflow:hidden;text-overflow:ellipsis}.truncate,.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-sm{border-radius:calc(var(--radius) - 4px)}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-0{border-width:0}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-r-0{border-right-width:0}.border-t{border-top-width:1px}.border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.bg-amber-200{--tw-bg-opacity:1;background-color:rgb(253 230 138/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1))}.bg-slate-300{--tw-bg-opacity:1;background-color:rgb(203 213 225/var(--tw-bg-opacity,1))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-slate-50\/70{background-color:rgba(248,250,252,.7)}.bg-slate-900{--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.bg-slate-950\/20{background-color:rgba(2,6,23,.2)}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-0{padding:0}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.px-0{padding-left:0;padding-right:0}.px-0\.5{padding-left:.125rem;padding-right:.125rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0{padding-top:0;padding-bottom:0}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-1{padding-bottom:.25rem}.pl-1{padding-left:.25rem}.pl-1\.5{padding-left:.375rem}.pl-2{padding-left:.5rem}.pl-6{padding-left:1.5rem}.pl-7{padding-left:1.75rem}.pr-7{padding-right:1.75rem}.pr-8{padding-right:2rem}.pt-0{padding-top:0}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:Geist Variable,sans-serif}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.text-\[9px\]{font-size:9px}.text-base{font-size:1rem;line-height:1.5rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.tracking-wide{letter-spacing:.025em}.tracking-widest{letter-spacing:.1em}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22/var(--tw-text-opacity,1))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-sky-600{--tw-text-opacity:1;color:rgb(2 132 199/var(--tw-text-opacity,1))}.text-slate-300{--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity,1))}.text-slate-400{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.text-slate-50{--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-600{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.text-slate-700{--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.text-slate-900\/50{color:rgba(15,23,42,.5)}.text-slate-950{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-yellow-500{--tw-text-opacity:1;color:rgb(234 179 8/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.decoration-slate-300{text-decoration-color:#cbd5e1}.decoration-slate-400{text-decoration-color:#94a3b8}.underline-offset-2{text-underline-offset:2px}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-50{opacity:.5}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}.shadow-none,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-slate-950\/20{--tw-shadow-color:rgba(2,6,23,.2);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-inset{--tw-ring-inset:inset}.ring-blue-500{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}.ring-offset-white{--tw-ring-offset-color:#fff}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-\[1px\]{--tw-backdrop-blur:blur(1px);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition-\[margin\]{transition-property:margin;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[width\2c opacity\]{transition-property:width,opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}.duration-100{animation-duration:.1s}.duration-200{animation-duration:.2s}.duration-300{animation-duration:.3s}.ease-in-out{animation-timing-function:cubic-bezier(.4,0,.2,1)}:root{--radius:0.625rem;--background:#fff;--foreground:#0f172a}.dark{--background:#0f172a;--foreground:#f8fafc}.file\:inline-flex::file-selector-button{display:inline-flex}.file\:h-6::file-selector-button{height:1.5rem}.file\:border-0::file-selector-button{border-width:0}.file\:bg-transparent::file-selector-button{background-color:transparent}.file\:text-sm::file-selector-button{font-size:.875rem;line-height:1.25rem}.file\:font-medium::file-selector-button{font-weight:500}.file\:text-slate-900::file-selector-button{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.placeholder\:text-slate-500::-moz-placeholder{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.placeholder\:text-slate-500::placeholder{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\:bg-red-500\/90:hover{background-color:rgba(239,68,68,.9)}.hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\:bg-slate-100\/80:hover{background-color:rgba(241,245,249,.8)}.hover\:bg-slate-200\/70:hover{background-color:rgba(226,232,240,.7)}.hover\:bg-slate-50:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.hover\:bg-slate-900\/90:hover{background-color:rgba(15,23,42,.9)}.hover\:text-blue-700:hover{--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity,1))}.hover\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.hover\:text-slate-600:hover{--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1))}.hover\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.hover\:text-slate-950:hover{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246/var(--tw-border-opacity,1))}.focus\:bg-slate-100:focus{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus\:text-slate-900:focus{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}.focus\:ring-slate-950:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(2 6 23/var(--tw-ring-opacity,1))}.focus-visible\:border-slate-400:focus-visible{--tw-border-opacity:1;border-color:rgb(148 163 184/var(--tw-border-opacity,1))}.focus-visible\:border-transparent:focus-visible{border-color:transparent}.focus-visible\:bg-slate-100:focus-visible{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus-visible\:opacity-100:focus-visible{opacity:1}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-0:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\:ring-inset:focus-visible{--tw-ring-inset:inset}.focus-visible\:ring-red-500:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-200:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(226 232 240/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-400:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(148 163 184/var(--tw-ring-opacity,1))}.focus-visible\:ring-slate-950:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(2 6 23/var(--tw-ring-opacity,1))}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-slate-100:disabled{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:opacity-100{opacity:1}.group\/dropdown-menu-item:focus .group-focus\/dropdown-menu-item\:text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:0.25rem}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom],.data-\[side\=left\]\:-translate-x-1[data-side=left]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:-0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:0.25rem}.data-\[side\=right\]\:translate-x-1[data-side=right],.data-\[side\=top\]\:-translate-y-1[data-side=top]{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:-0.25rem}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out}.data-\[state\=closed\]\:overflow-hidden[data-state=closed]{overflow:hidden}.data-\[state\=open\]\:bg-slate-100[data-state=open]{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.data-\[inset\=true\]\:pl-7[data-inset=true]{padding-left:1.75rem}.data-\[state\=open\]\:text-slate-900[data-state=open]{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.data-\[variant\=destructive\]\:text-red-600[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[state\=open\]\:animate-in[data-state=open]{animation-name:enter;animation-duration:.15s;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation-name:exit;animation-duration:.15s;--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial}.data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-0.5rem}.data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:0.5rem}.data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:-0.5rem}.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:0.5rem}.data-\[variant\=destructive\]\:focus\:bg-red-50:focus[data-variant=destructive]{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.data-\[variant\=destructive\]\:focus\:text-red-600:focus[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.dark\:border-slate-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity,1))}.dark\:bg-red-900:is(.dark *){--tw-bg-opacity:1;background-color:rgb(127 29 29/var(--tw-bg-opacity,1))}.dark\:bg-slate-50:is(.dark *){--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.dark\:bg-slate-600:is(.dark *){--tw-bg-opacity:1;background-color:rgb(71 85 105/var(--tw-bg-opacity,1))}.dark\:bg-slate-700:is(.dark *){--tw-bg-opacity:1;background-color:rgb(51 65 85/var(--tw-bg-opacity,1))}.dark\:bg-slate-800:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:bg-slate-950:is(.dark *){--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.dark\:text-slate-400:is(.dark *){--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:text-slate-50:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:text-slate-50\/50:is(.dark *){color:rgba(248,250,252,.5)}.dark\:text-slate-900:is(.dark *){--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.dark\:ring-offset-slate-950:is(.dark *){--tw-ring-offset-color:#020617}.dark\:file\:text-slate-50:is(.dark *)::file-selector-button{--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:placeholder\:text-slate-400:is(.dark *)::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:placeholder\:text-slate-400:is(.dark *)::placeholder{--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\:hover\:bg-red-900\/90:hover:is(.dark *){background-color:rgba(127,29,29,.9)}.dark\:hover\:bg-slate-50\/90:hover:is(.dark *){background-color:rgba(248,250,252,.9)}.dark\:hover\:bg-slate-700\/50:hover:is(.dark *){background-color:rgba(51,65,85,.5)}.dark\:hover\:bg-slate-800:hover:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:hover\:bg-slate-800\/80:hover:is(.dark *){background-color:rgba(30,41,59,.8)}.dark\:hover\:text-slate-50:hover:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:focus\:bg-slate-800:focus:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:focus\:text-slate-50:focus:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:focus\:ring-slate-300:focus:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.dark\:focus-visible\:border-slate-600:focus-visible:is(.dark *){--tw-border-opacity:1;border-color:rgb(71 85 105/var(--tw-border-opacity,1))}.dark\:focus-visible\:ring-slate-300:focus-visible:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.dark\:focus-visible\:ring-slate-800:focus-visible:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(30 41 59/var(--tw-ring-opacity,1))}.dark\:disabled\:bg-slate-900:disabled:is(.dark *){--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.group\/dropdown-menu-item:focus .dark\:group-focus\/dropdown-menu-item\:text-slate-50:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:data-\[state\=open\]\:bg-slate-800[data-state=open]:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\:data-\[state\=open\]\:text-slate-50[data-state=open]:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\:data-\[variant\=destructive\]\:focus\:bg-red-950\/40:focus[data-variant=destructive]:is(.dark *){background-color:rgba(69,10,10,.4)}@media (min-width:640px){.sm\:inline-flex{display:inline-flex}.sm\:w-48{width:12rem}.sm\:gap-2\.5{gap:.625rem}}@media (min-width:768px){.md\:text-sm{font-size:.875rem;line-height:1.25rem}}.\[\&\>span\]\:line-clamp-1>span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.\[\&\>svg\]\:h-3\.5>svg{height:.875rem}.\[\&\>svg\]\:w-3\.5>svg{width:.875rem}.first\:\[\&\[data-state\=open\]\>svg\]\:rotate-90[data-state=open]>svg:first-child{--tw-rotate:90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3\.5 svg:not([class*=size-]){width:.875rem;height:.875rem}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:1rem;height:1rem}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.data-\[variant\=destructive\]\:\[\&_svg\]\:text-red-600 svg[data-variant=destructive]{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}} From 27771f2c76eb52711b94d4de5a36846784fc3445 Mon Sep 17 00:00:00 2001 From: mohan-bee Date: Sat, 18 Jul 2026 18:17:01 +0530 Subject: [PATCH 10/13] style: Update dropdown styling with gray backgrounds and added margins --- src/components/FileDropdown.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/FileDropdown.tsx b/src/components/FileDropdown.tsx index 05fbfc5..41d73a1 100644 --- a/src/components/FileDropdown.tsx +++ b/src/components/FileDropdown.tsx @@ -168,13 +168,13 @@ export function FileDropdown({
    {!open ? (