{"version":3,"file":"98.4f3be8aeeabe895eb3a9.css","mappings":"AAGI,mCACI,eAEA,+CACI,gBAGJ,oDACI,8CACA,kBACA,qBACA,kCACA,2BACA,kBAGI,8DACI,cACA,cACA,eAIR,yEACI,4CAGJ,qHAEI,aAGJ,6DACI,WACA,mBAKJ,sKAEI,kCACA,oCACA,oCAGI,0LACI,oCAQxB,kBACI,gDACA,mCACA,iBACA,gBACA,sBACA,qBACA,iBACA,kBACA,c;ACjEJ,mCACI,aACA,sBACA,YACA,WAGA,kBAGJ,4CACI,aACA,sBACA,WAKJ,gDACI,SACA,sBACA,+CACA,mBACA,gBACA,2BAGJ,0CACI,aACA,sBACA,YAGJ,6CACI,SACA,mBACA,gBACA,2BAGJ,0CACI,SACA,mBACA,kCAGJ,yCACI,aACA,sBACA,QAGJ,0CACI,gBACA,2BAGJ,yCACI,iBACA,kCAEA,mGACA,+FAGJ,yCACI,kCAGJ,2CACI,mBACA,kCAMJ,4CACI,aACA,eACA,mBACA,iBACA,iBACA,uCAGJ,qFAEI,SACA,mBACA,kCAKJ,kCACI,UACA,mBACA,iBAMJ,2CACI,oBAIJ,oDACI,aACA,mBACA,yBACA,UAGJ,0CACI,iBACA,kC;AAtHJ,kCACI,iBAOJ,4BACI,W;ACTJ,uBACI,wCACA,kBACA,sCACA,aACA,QACA,mBACA,eACA,2BACA,mBAEA,gCACI,WACA,mBAGJ,8BACI,0CACA,8CAEA,yCACI,2CAIR,qCACI,aACA,mBACA,iBAGJ,kCACI,UACA,mBACA,6CAGJ,6BACI,mCACA,mBACA,gBCtBM,CDuBN,aACA,Q;AExCA,sCACI,kCACA,gBACA,gBDYE,C;AEfN,sCACI,kCACA,gBACA,gBFYE,C;AGhBV,8BACI,eAEA,0CACI,gBAGJ,+CACI,8CACA,kBACA,qBACA,kCACA,2BACA,kBAGI,yDACI,cACA,cACA,eAIR,oEACI,4CAGJ,oEACI,aACA,gDACA,mCAGJ,wDACI,WACA,mBAKJ,4JAEI,kCACA,oCACA,oCAGI,gLACI,oCAQxB,0CACI,gD;AC1DJ,6CACI,aACA,2BACA,cACA,OAEA,8DACI,OACA,gBACA,qBACA,aACA,U;ACXR,kCACI,aACA,sBACA,MACA,aACA,4CACA,kCACA,cACA,kBACA,iBACA,gBAGJ,iCACI,aACA,8BACA,mBACA,oBAGJ,gCACI,aACA,UACA,mBAMA,+FAEI,kCAKJ,uCACI,mBACA,gCAIJ,mDACI,oBACA,cAIR,wBACI,qBACA,qBACA,kBACA,eACA,2BACA,+BAEA,iCACI,WACA,mBAIR,iCACI,wCACA,cACA,0CACA,qBACA,kBAEA,sDACI,4CAIR,2BACI,wCACA,oCACA,oCACA,kBACA,qBAEA,gDACI,iDAIR,2BACI,wCACA,cACA,0CACA,aACA,mBACA,UACA,kBACA,qBAEA,mCACI,WACA,aACA,cACA,8CACA,sBAGJ,iCACI,4CAIR,+BACI,aACA,mBACA,uBACA,eACA,kBACA,+BACA,kCAEA,oDACI,4CACA,kCAGJ,qCACI,cACA,eAIR,gCACI,OACA,aACA,sBAIA,aACA,+CACA,oBACA,iCAEA,wCACI,mCAGJ,4CAII,qBACA,cACA,aACA,WACA,aACA,sBACA,gBACA,YACA,aACA,kBACA,gBACA,kCACA,YACA,oBACA,kCAEA,kDACI,aAGJ,qDACI,mBACA,4CACA,kCAGJ,yDACI,kCAIR,yCACI,cACA,aACA,8BACA,WAEA,gDACI,aACA,yB;AA5LZ,iBACI,aACA,sBACA,WACA,gBAEA,wBACI,aACA,sBAGA,U;ACXR,oCACI,aACA,sBACA,mBACA,WACA,aAGJ,+BACI,aACA,UACA,mBAGJ,8BACI,UACA,WACA,kBACA,uCACA,6DAEA,2CACI,uBAGJ,2CACI,uBAIR,+BACI,YACI,qBACA,WAEJ,IACI,mBACA,WAIR,kCACI,kBACA,gCACA,kBACA,uCAGJ,4BACI,KACI,UACA,2BAEJ,GACI,UACA,yB;ACvDR,gCACI,eACA,gBACA,kCAGJ,8BACI,oBACA,sBAEA,mCACI,qBACA,sBACA,gDACA,mCACA,kBACA,kB;ACfJ,wCACI,mBACA,gBACA,gBACA,uBAGJ,wCACI,oBACA,gBACA,gBACA,wBAGJ,wCACI,eACA,gBACA,gBACA,uBAGJ,wHAGI,mBACA,gBACA,gBACA,yBAGJ,kDACI,oBACA,kCAGJ,2DACI,6BAGJ,4JAGI,aAGJ,wCACI,eAEA,2CACI,mBAIR,wCACI,eAEA,2CACI,mBAIR,gDACI,eACA,sBACA,6CACA,kCAGJ,mDACI,eAEA,sDACI,gBACA,aACA,qBACA,WAIR,oDACI,gBACA,wCACA,oBACA,gBACA,mBAEA,wDACI,SACA,aACA,gBACA,sCACA,gBACA,gBACA,qBACA,kBAEA,6DACI,6FACA,yBACA,YACA,UACA,gBACA,kBAKZ,4DACI,aACA,mBACA,8BACA,mBACA,6CACA,+CACA,gBAGJ,0DACI,6FACA,mBACA,kCACA,yBAGJ,0DACI,oBACA,mBACA,uBACA,YACA,yBACA,YACA,kBACA,eACA,kCACA,wBAEA,8DACI,aACA,cACA,oBAGJ,gEACI,oCACA,wCAIR,0CACI,UACA,YACA,gBAGJ,qDACI,gBACA,wCACA,oBACA,gBAGJ,6DACI,aACA,mBACA,2BACA,mBACA,6CACA,+CACA,gBAGJ,2DACI,oBACA,mBACA,uBACA,YACA,yBACA,YACA,kBACA,eACA,kCACA,wBAEA,+DACI,aACA,cACA,oBAGJ,iEACI,oCACA,wCAIR,2CACI,WACA,yBACA,mBAEA,8CACI,gBACA,gBACA,sCAGJ,4FACI,uBACA,wCAGJ,0DACI,sC;ACpNR,4CACI,mBACA,gBACA,kCACA,mBAGJ,8CACI,iCACA,kBACA,kB;ACXR,iCACI,mBACA,qBACA,yBACA,oBAEA,4CACI,2BACA,mDACA,2BACA,kCAGJ,sDACI,UAEA,iEACI,+BAIR,+CACI,wCACA,oCACA,mCACA,kBACA,eAGJ,gDACI,uBACA,kBACA,gBAEA,+DACI,mDACA,0CACA,oBACA,gBACA,eACA,WAGJ,+DACI,iDACA,oC;;AC7CZ,gCACI,eACA,gBACA,kCACA,oBAIA,8CACI,aACA,sBACA,U;ACXR,gCACI,eACA,gBACA,kCACA,oBAGJ,8BACI,mBAEA,0CACI,gBACA,UACA,SACA,aACA,sBACA,WAGJ,yCACI,aACA,uBAGJ,2CACI,cACA,aACA,cACA,aACA,mBACA,uBACA,wCACA,oCACA,kBACA,kBACA,oBACA,mBAGJ,4CACI,OAEA,wDACI,eACA,gBACA,kCACA,oBAGJ,yDACI,kBACA,gCACA,oBACA,gB;ACrDZ,yBACI,mBAEA,4BACI,iBACA,aACA,mBACA,QACA,gCAEA,qCACI,kCAIR,4BACI,gBACA,oBAEA,+BACI,iB;ACpBZ,+BACI,aACA,uBACA,UACA,eACA,wCACA,wCACA,oBACA,qBACA,kCACA,wBAEA,qCACI,0CACA,4CAIR,kCACI,cACA,WACA,YACA,mBACA,sBACA,mBAGJ,+BACI,OACA,YACA,aACA,mBACA,UAGJ,+BACI,OACA,YACA,aACA,sBACA,YAGJ,kCACI,cAGJ,+BACI,kBACA,gBACA,sBACA,kCACA,gBACA,uBACA,mBAEA,mDACI,gBACA,uBACA,mBAIR,8BACI,iBACA,kCACA,gBACA,uBACA,mBACA,SAEA,kDACI,gBACA,uBACA,mB;AC1ER,gCACI,eACA,gBACA,kCACA,oBAIA,gDACI,aACA,sBACA,U;ACPR,8BACI,aACA,sBACA,WAGJ,+BACI,aACA,eACA,mBACA,Q;ACdJ,mCACI,aACA,sBACA,SAGJ,iCACI,aACA,sBACA,UAGJ,gCACI,aACA,sBACA,WAGJ,iCACI,eACA,gBACA,kCACA,SAGJ,gCACI,iBACA,kBACA,kCAGJ,gCACI,aACA,sBACA,UAIJ,+BACI,cAGJ,qCACI,cACA,eACA,gBACA,mBACA,gBACA,kCAGJ,oCACI,aACA,mBACA,Q;ACtDJ,gCACI,aACA,uBACA,UACA,eACA,wCACA,wCACA,oBACA,qBACA,kCACA,wBAEA,sCACI,0CACA,4CAIR,gCACI,cACA,WACA,YACA,mBACA,mBAGJ,gCACI,OACA,aACA,sBACA,WACA,YAGJ,iCACI,kBACA,gBACA,kCACA,gBACA,uBACA,mBAEA,qDACI,gBACA,uBACA,mBAIR,+BACI,iBACA,kCACA,SACA,gBACA,uBACA,mBAEA,mDACI,gBACA,uBACA,mB;AC5DR,gCACI,eACA,gBACA,kCACA,oBAIA,kDACI,aACA,sBACA,U;ACXR,8BACI,mBAEA,iCACI,iBACA,aACA,mBACA,QACA,gCAEA,0CACI,kCAIR,iCACI,gBACA,oBAEA,oCACI,iB;ACpBZ,8BACI,wCACA,kBACA,gBACA,sCAGJ,sCACI,aACA,mBACA,QACA,gBACA,uCACA,+CAGJ,qCACI,iBACA,gBACA,kCAGJ,+CACI,gBACA,kCAGJ,qCACI,WACA,YACA,8BAEA,2CACI,wBAIR,2CACI,iBAGJ,sCACI,gBAGJ,uCACI,SACA,YACA,sBACA,mBACA,gBAGJ,kEACI,qBACA,qB;ACvDJ,uCACI,aACA,sBACA,UACA,eACA,wCACA,kBACA,sCAEA,cAGJ,uCACI,aACA,mBACA,QAGJ,qCACI,gBAGJ,oCACI,iBACA,gBACA,kBACA,sHACA,+HACA,kIAGJ,wCACI,aACA,eACA,mBACA,QAGJ,wCACI,SACA,gBACA,kC;ACzCJ,4CACI,aACA,sBACA,WAGJ,6CACI,kBACA,gBACA,2BAGJ,4CACI,aACA,mBACA,8BACA,YACA,iBACA,kCACA,6FAGJ,6CACI,oBACA,mBACA,uBACA,kBACA,gBACA,iBACA,mBACA,gBACA,gCACA,6CACA,uBACA,cACA,YAGJ,+CACI,iBACA,aACA,sBACA,UAGJ,+CACI,wCACA,sBACA,gBAGJ,sDACI,aACA,mBACA,YACA,qBACA,wCACA,eACA,iBACA,iBACA,gBACA,gCAEA,4DACI,4CAGJ,qEACI,aACA,cACA,kCACA,cACA,8BAEA,6EACI,wBAKZ,qDACI,OAGJ,wDACI,kCACA,gBAIA,gDACI,SACA,eACA,mDACA,sBACA,gBAEA,qDACI,6FACA,mBACA,2BACA,qBACA,sBACA,YACA,yBACA,UAKR,0EACI,4CAEA,8EACI,gB;AClHZ,sCACI,4CACA,wCACA,kCACA,gBACA,cAGJ,8CACI,aACA,mBACA,oBACA,UACA,wCACA,eACA,iBAEA,oDACI,4CAGJ,uDACI,WACA,YACA,kCACA,cACA,8BAEA,+DACI,wBAKZ,6CACI,eACA,gBACA,2BACA,OAGJ,gDACI,eACA,kCAGJ,4CACI,oBACA,4CACA,oBACA,aACA,sBACA,WACA,+CACA,gBACA,+BAEA,wDACI,gD;AC1DR,kCACI,oB;ACDJ,yCACI,kBACA,SACA,SACA,2BACA,UACA,kCACA,kBACA,oC;ACPJ,8BACI,gDACA,oBACA,qBACA,oBAEA,yCACI,mCACA,kBACA,SACA,gBAGJ,yCACI,cACA,0BAEA,+CACI,kCAIR,0CACI,qBACA,wCACA,oCACA,kBACA,gBACA,wBACA,qBACA,yBACA,sBACA,YACA,wB;AClCR,gCACI,gDACA,mBACA,gBACA,mBACA,4CAEA,oDACI,mCACA,kBACA,SACA,gBAGJ,sDACI,gBACA,aACA,mBACA,8BAGJ,oDACI,aACA,gBACA,kBACA,iEACA,uBAGJ,qDACI,qBACA,wCACA,oCACA,gBACA,qBACA,yBACA,sBACA,eACA,wBACA,sBACA,iBAIA,6DACI,+CACA,oCAIR,sLAGI,iBACA,mB;ACtDR,4BACI,aACA,sBACA,YACA,kCACA,gBACA,kBAGJ,qCACI,OACA,gBACA,aACA,uBACA,aAGA,wDACI,UAGJ,8DACI,yBAGJ,8DACI,+CACA,kBAEA,oEACI,6CAKZ,8BACI,aACA,sBACA,mBACA,uBACA,YACA,kBACA,aACA,gCAEA,gDACI,WACA,YACA,mBACA,6BAEA,oDACI,WACA,YAIR,iCACI,iBACA,gBACA,kCACA,mBAGJ,gCACI,eACA,SACA,gBAIR,gCACI,WAGJ,uDACI,iB","sources":["webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/CapabilitiesSelector.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/ToolPermissionsSettings.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/chips/DefaultChip.vue","webpack://@flowfuse/flowfuse/./frontend/src/ui-components/stylesheets/ff-utility.scss","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/chips/DebugChip.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/chips/SelectionChip.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/context-selection/ContextSelectorButton.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/context-selection/index.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/ExpertChatInput.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/ExpertLoadingIndicator.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/AnswerBadge.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/StreamableContent.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/GuideHeader.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/MessageBubble.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/FlowsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/GuideStepsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/IssuesList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resource-cards/PackageResourceCard.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/PackagesList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/PlanCard.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/QuestionsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resource-cards/StandardResourceCard.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/ResourcesList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/SuggestionsList.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/JsonViewer.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/resources/ToolApprovalCard.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/ToolCallItem.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/messages/components/ToolCalls.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/ExpertMessages.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/ExpertModeSwitcher.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/InfoBanner.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/components/UpdateBanner.vue","webpack://@flowfuse/flowfuse/./frontend/src/components/expert/Expert.vue"],"sourcesContent":["@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.capabilities-selector {\n    .ff-listbox {\n        min-width: auto;\n\n        .ff-options {\n            max-width: 320px;\n        }\n\n        button.ff-button {\n            border: 1px solid var(--ff-color-accent-light); // indigo-300 to match other buttons\n            border-radius: 5px;\n            padding: 0.25rem 0.50rem;\n            background: var(--ff-color-bg-app);\n            color: var(--ff-color-text); // gray-800, explicit dark text\n            font-size: 0.875rem;\n\n            .icon {\n                svg {\n                    color: inherit;\n                    width: 1.25rem;\n                    height: 1.25rem;\n                }\n            }\n\n            &:hover:not(:disabled) {\n                background-color: var(--ff-color-bg-surface); // gray-50\n            }\n\n            &:focus,\n            &.active {\n                outline: none;\n            }\n\n            &:disabled {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n        }\n\n        &[data-headlessui-state=\"open\"] {\n            button.ff-button,\n            button.ff-button:hover {\n                background: var(--ff-color-accent);\n                border-color: var(--ff-color-accent);\n                color: var(--ff-color-text-on-brand);\n\n                .icon {\n                    svg {\n                        color: var(--ff-color-text-on-brand);\n                    }\n                }\n            }\n        }\n    }\n}\n\n.tool-count-badge {\n    background-color: var(--ff-color-accent-surface); // indigo-100\n    color: var(--ff-color-accent-hover); // indigo-700\n    font-size: 0.75rem;\n    font-weight: 500;\n    padding: 0.125rem 0.5rem;\n    border-radius: 9999px;\n    min-width: 1.5rem;\n    text-align: center;\n    flex-shrink: 0;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.tool-permissions {\n    display: flex;\n    flex-direction: column;\n    gap: 1.75rem;\n    width: 100%;\n    // Separate the first group title from the dialog's \"Tool permissions\" intro\n    // paragraph above, which sits close by via the settings group's small gap.\n    margin-top: 0.75rem;\n}\n\n.tool-permissions__section {\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n}\n\n// Group title (Flow Building / Platform) — a subheading under the dialog's\n// \"Tool permissions\" heading, so it reads as subordinate rather than a peer.\n.tool-permissions__group-title {\n    margin: 0;\n    padding-bottom: 0.25rem;\n    border-bottom: 1px solid var(--ff-color-border);\n    font-size: 0.9375rem;\n    font-weight: 600;\n    color: var(--ff-color-text);\n}\n\n.tool-permissions__block {\n    display: flex;\n    flex-direction: column;\n    gap: 0.375rem;\n}\n\n.tool-permissions__subtitle {\n    margin: 0;\n    font-size: 0.8125rem;\n    font-weight: 600;\n    color: var(--ff-color-text);\n}\n\n.tool-permissions__intro {\n    margin: 0;\n    font-size: 0.8125rem;\n    color: var(--ff-color-text-subtle);\n}\n\n.tool-permissions__cell {\n    display: flex;\n    flex-direction: column;\n    gap: 1px;\n}\n\n.tool-permissions__title {\n    font-weight: 500;\n    color: var(--ff-color-text);\n}\n\n.tool-permissions__hint {\n    font-size: 0.75rem;\n    color: var(--ff-color-text-subtle);\n\n    &.is-requires-update { color: var(--ff-color-status-info-text); }\n    &.is-deprecated { color: var(--ff-color-status-error-text); }\n}\n\n.tool-permissions__type {\n    color: var(--ff-color-text-subtle);\n}\n\n.tool-permissions__static {\n    font-size: 0.8125rem;\n    color: var(--ff-color-text-subtle);\n}\n\n// The \"X for this chat\" note + its Make permanent action, under a tool name. Wraps so\n// the action drops to its own line (with full width) in the narrow tool column rather\n// than being squeezed and clipped.\n.tool-permissions__session {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 0.25rem 0.5rem;\n    font-size: 0.75rem;\n    color: var(--ff-color-status-info-text);\n}\n\n.tool-permissions__notice,\n.tool-permissions__empty {\n    margin: 0;\n    font-size: 0.8125rem;\n    color: var(--ff-color-text-subtle);\n}\n\n// Keep the permission column hugging the right edge so each tool name lines up\n// with its own control across the row border, rather than floating in whitespace.\n:deep(.permission-col) {\n    width: 1px;\n    white-space: nowrap;\n    text-align: right;\n}\n\n// The class lands on the toggle's own root element, so it styles without :deep. The\n// button size is set through ToggleButtonGroup's `size` prop, not by reaching inside it.\n// inline-flex lets the right-aligned permission column push the control to the edge.\n.tool-permissions__toggle {\n    display: inline-flex;\n}\n\n// Count + Reset sit to the left of the class-default toggle, all hugging the right edge.\n.tool-permissions__default-control {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: 0.5rem;\n}\n\n.tool-permissions__count {\n    font-size: 0.75rem;\n    color: var(--ff-color-text-subtle);\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.chip {\n    border: 1px solid var(--ff-color-border);\n    border-radius: 5px;\n    background: var(--ff-color-bg-surface);\n    display: flex;\n    gap: 5px;\n    align-items: center;\n    cursor: pointer;\n    transition: 0.3s ease-in-out;\n    white-space: nowrap;\n\n    &.disabled {\n        opacity: 0.5;\n        cursor: not-allowed;\n    }\n\n    &.active {\n        background: var(--ff-color-accent-surface);\n        border: 1px solid var(--ff-color-accent-light);\n\n        .separator {\n            background: var(--ff-color-chip-default-bg);\n        }\n    }\n\n    .icon-wrapper {\n        display: flex;\n        align-items: center;\n        margin-right: 5px;\n    }\n\n    .separator {\n        width: 1px;\n        align-self: stretch;\n        background: var(--ff-color-status-warning-bg);\n    }\n\n    .text {\n        padding: 0.25rem 0.50rem 0.25rem 0.25rem;\n        align-items: center;\n        font-size: $ff-funit-sm;\n        display: flex;\n        gap: 2px;\n    }\n}\n","/*\n    ff-utility contains functional variables and classes for padding/margin and sizings\n*/\n\n// screen sizes\n$ff-screen-sm: 640px;\n$ff-screen-md: 768px;\n$ff-screen-lg: 1024px;\n$ff-screen-xl: 1280px;\n$ff-screen-2xl: 1536px;\n\n// unit\n$ff-unit-xs: 3px;\n$ff-unit-sm: 6px;\n$ff-unit-md: 9px;\n$ff-unit-lg: 18px;\n$ff-unit-xl: 27px;\n\n// font unit\n$ff-funit-xs: 0.75rem;\n$ff-funit-sm: 0.85rem;\n$ff-funit-md: 1rem;\n$ff-funit-lg: 1.5rem;\n$ff-funit-xl: 2rem;\n\n@mixin truncate {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.flow-selection-button {\n    .text {\n        .counter {\n            color: var(--ff-color-text-subtle);\n            margin-left: 4px;\n            font-size: $ff-funit-xs;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.flow-selection-button {\n    .text {\n        .counter {\n            color: var(--ff-color-text-subtle);\n            margin-left: 4px;\n            font-size: $ff-funit-xs;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.context-selector {\n    .ff-listbox {\n        min-width: auto;\n\n        .ff-options {\n            max-width: 320px;\n        }\n\n        button.ff-button {\n            border: 1px solid var(--ff-color-accent-light); // indigo-300 to match other buttons\n            border-radius: 5px;\n            padding: 0.25rem 0.50rem;\n            background: var(--ff-color-bg-app);\n            color: var(--ff-color-text); // gray-800, explicit dark text\n            font-size: 0.875rem;\n\n            .icon {\n                svg {\n                    color: inherit;\n                    width: 1.25rem;\n                    height: 1.25rem;\n                }\n            }\n\n            &:hover:not(:disabled) {\n                background-color: var(--ff-color-bg-surface); // gray-50\n            }\n\n            &:focus:not(:disabled) {\n                outline: none;\n                background-color: var(--ff-color-accent-surface); // indigo-100\n                color: var(--ff-color-accent-hover); // indigo-700\n            }\n\n            &:disabled {\n                opacity: 0.5;\n                cursor: not-allowed;\n            }\n        }\n\n        &[data-headlessui-state=\"open\"] {\n            button.ff-button,\n            button.ff-button:hover {\n                background: var(--ff-color-accent);\n                border-color: var(--ff-color-accent);\n                color: var(--ff-color-text-on-brand);\n\n                .icon {\n                    svg {\n                        color: var(--ff-color-text-on-brand);\n                    }\n                }\n            }\n        }\n    }\n}\n\n.context-selector.active .relative button {\n    background-color: var(--ff-color-accent-surface); // indigo-100\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.context-selector-container {\n    display: flex;\n    justify-content: flex-start;\n    overflow: auto;\n    flex: 1;\n\n    .chips-container {\n        flex: 1;\n        overflow-x: auto;\n        scrollbar-width: none;\n        display: flex;\n        gap: 0.5rem;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-expert-input {\n    display: flex;\n    flex-direction: column;\n    gap: 0;\n    padding: 1rem; // p-4\n    border-top: 1px solid var(--ff-color-border); // border-gray-200\n    background: var(--ff-color-bg-app);\n    flex-shrink: 0; // Prevent input area from shrinking\n    position: relative;\n    min-height: 180px;\n    max-height: 40vh;\n}\n\n.action-buttons {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 0.5rem;\n}\n\n.right-buttons {\n    display: flex;\n    gap: 0.5rem;\n    align-items: center;\n}\n\n// Reuses the shared DefaultChip; only tweaks needed here are neutralising the chip's\n// warning-yellow separator and centring the label around the divider.\n.plan-mode-chip {\n    :deep(.separator),\n    &.active :deep(.separator) {\n        background: var(--ff-color-border);\n    }\n\n    // DefaultChip's .text padding is asymmetric and it adds a 5px flex gap before the\n    // divider; equalise so \"Plan mode\" sits centred on both sides of the divider cell.\n    :deep(.text) {\n        padding-left: 0.5rem;\n        padding-right: calc(0.5rem - 5px);\n    }\n\n    // The switch is a visual indicator only; the chip handles the click.\n    :deep(.ff-toggle-switch) {\n        pointer-events: none;\n        flex-shrink: 0;\n    }\n}\n\nbutton {\n    padding: 0.5rem 0.75rem; // py-2 px-3\n    border-radius: 9999px; // rounded-full\n    font-size: 0.875rem; // text-sm\n    cursor: pointer;\n    transition: colors 0.2s ease;\n    border: 1px solid transparent;\n\n    &:disabled {\n        opacity: 0.5;\n        cursor: not-allowed;\n    }\n}\n\n.btn-start-over {\n    background-color: var(--ff-color-bg-app);\n    color: inherit;\n    border-color: var(--ff-color-accent-light); // indigo-300\n    padding: 0.25rem 0.50rem;\n    border-radius: 5px;\n\n    &:hover:not(:disabled) {\n        background-color: var(--ff-color-bg-surface); // gray-50\n    }\n}\n\n.btn-send {\n    background-color: var(--ff-color-accent);\n    color: var(--ff-color-text-on-brand);\n    border-color: var(--ff-color-accent);\n    border-radius: 5px;\n    padding: 0.25rem 0.50rem;\n\n    &:hover:not(:disabled) {\n        background-color: var(--ff-color-accent-hover-bg);\n    }\n}\n\n.btn-stop {\n    background-color: var(--ff-color-bg-app);\n    color: inherit;\n    border-color: var(--ff-color-accent-light); // indigo-300\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    border-radius: 5px;\n    padding: 0.25rem 0.50rem;\n\n    &::before {\n        content: '';\n        width: 0.75rem; // w-3\n        height: 0.75rem; // h-3\n        background-color: var(--ff-color-surface-dark);\n        border-radius: 0.125rem; // rounded-xs\n    }\n\n    &:hover {\n        background-color: var(--ff-color-bg-surface); // gray-50\n    }\n}\n\n.btn-settings {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0.25rem;\n    border-radius: 5px;\n    background-color: transparent;\n    color: var(--ff-color-text-subtle);\n\n    &:hover:not(:disabled) {\n        background-color: var(--ff-color-bg-surface); // gray-50\n        color: var(--ff-color-text-strong);\n    }\n\n    &__icon {\n        width: 1.25rem;\n        height: 1.25rem;\n    }\n}\n\n.input-wrapper {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    // min-height: 0 must be on every ancestor in this flex chain, not just .chat-input:\n    // without it this wrapper keeps its content (min-content) height, so a long plan loaded\n    // via \"Edit\" pushes the whole composer tall instead of letting the textarea scroll.\n    min-height: 0;\n    border: 2px solid var(--ff-color-border-strong); // border-2 border-gray-300\n    border-radius: 0.5rem; // rounded-lg\n    transition: border-color 0.2s ease;\n\n    &.focused {\n        border-color: var(--ff-color-focus);\n    }\n\n    .chat-input {\n        // field-sizing grows the textarea with its content up to the composer's max-height.\n        // min-height: 0 lets it shrink within the flex box past its content height (loading a\n        // long plan via \"Edit manually\") so overflow-y scrolls instead of overflowing the chat.\n        field-sizing: content;\n        flex: 1 1 auto;\n        min-height: 0;\n        width: 100%;\n        padding: 1rem; // p-4\n        box-sizing: border-box;\n        overflow-y: auto;\n        border: none;\n        outline: none;\n        font-size: 0.875rem; // text-sm\n        line-height: 1.5;\n        color: var(--ff-color-text-strong); // text-gray-900\n        resize: none;\n        font-family: inherit;\n        background: var(--ff-color-bg-app);\n\n        &:focus {\n            outline: none;\n        }\n\n        &:disabled {\n            cursor: not-allowed;\n            background-color: var(--ff-color-bg-surface); // bg-gray-50\n            color: var(--ff-color-text-subtle); // text-gray-500\n        }\n\n        &::placeholder {\n            color: var(--ff-color-text-subtle); // placeholder gray\n        }\n    }\n\n    .actions {\n        padding: .5rem;\n        display: flex;\n        justify-content: space-between;\n        gap: 0.75rem;\n\n        .right {\n            display: flex;\n            justify-content: flex-end;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-expert-loading {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 0.75rem;\n    padding: 1rem;\n}\n\n.loading-dots {\n    display: flex;\n    gap: 0.5rem;\n    align-items: center;\n}\n\n.loading-dot {\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: var(--ff-color-focus);\n    animation: bounce-dot 1.4s infinite ease-in-out both;\n\n    &:nth-child(1) {\n        animation-delay: -0.32s;\n    }\n\n    &:nth-child(2) {\n        animation-delay: -0.16s;\n    }\n}\n\n@keyframes bounce-dot {\n    0%, 80%, 100% {\n        transform: scale(0.7);\n        opacity: 0.5;\n    }\n    40% {\n        transform: scale(1);\n        opacity: 1;\n    }\n}\n\n.loading-message {\n    font-size: 0.875rem;\n    color: var(--ff-color-text-deep);\n    font-style: italic;\n    animation: fade-in 0.3s ease-in;\n}\n\n@keyframes fade-in {\n    from {\n        opacity: 0;\n        transform: translateY(-4px);\n    }\n    to {\n        opacity: 1;\n        transform: translateY(0);\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section-title {\n    font-size: 1rem;\n    font-weight: 500;\n    color: var(--ff-color-text-strong);\n}\n\n.guide-badge {\n    display: inline-flex;\n    align-self: flex-start;\n\n    span {\n        display: inline-block;\n        padding: 0.25rem 0.75rem;\n        background-color: var(--ff-color-accent-surface);\n        color: var(--ff-color-accent-hover);\n        font-size: 0.875rem;\n        border-radius: 5px;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.streamable-content {\n    :deep(h1) {\n        font-size: 1.125rem;\n        font-weight: 600;\n        line-height: 1.4;\n        margin: 0.75rem 0 0.25rem;\n    }\n\n    :deep(h2) {\n        font-size: 1.0625rem;\n        font-weight: 600;\n        line-height: 1.4;\n        margin: 0.625rem 0 0.25rem;\n    }\n\n    :deep(h3) {\n        font-size: 1rem;\n        font-weight: 600;\n        line-height: 1.4;\n        margin: 0.5rem 0 0.125rem;\n    }\n\n    :deep(h4),\n    :deep(h5),\n    :deep(h6) {\n        font-size: 0.9375rem;\n        font-weight: 600;\n        line-height: 1.4;\n        margin: 0.375rem 0 0.125rem;\n    }\n\n    :deep(.ff-checkbox) {\n        margin-right: 0.25rem;\n        color: var(--ff-color-text-subtle);\n    }\n\n    :deep(.ff-checkbox--checked) {\n        color: var(--ff-color-accent);\n    }\n\n    :deep(h1:first-child),\n    :deep(h2:first-child),\n    :deep(h3:first-child) {\n        margin-top: 0;\n    }\n\n    :deep(ul) {\n        padding: revert;\n\n        li {\n            list-style: initial;\n        }\n    }\n\n    :deep(ol) {\n        padding: revert;\n\n        li {\n            list-style: decimal;\n        }\n    }\n\n    :deep(blockquote) {\n        margin: 0.5rem 0;\n        padding: 0.25rem 0.75rem;\n        border-left: 3px solid var(--ff-color-accent);\n        color: var(--ff-color-text-subtle);\n    }\n\n    :deep(.ff-task-list) {\n        padding-left: 0;\n\n        li {\n            list-style: none;\n            display: flex;\n            align-items: baseline;\n            gap: 0.25rem;\n        }\n    }\n\n    :deep(.ff-code-block) {\n        margin: 0.75rem 0;\n        border: 1px solid var(--ff-color-border);\n        border-radius: 0.5rem;\n        overflow: hidden;\n        font-size: 0.8125rem;\n\n        pre {\n            margin: 0;\n            padding: 1rem;\n            overflow-x: auto;\n            background: var(--ff-color-bg-surface);\n            border-radius: 0;\n            white-space: pre;\n            overflow-wrap: normal;\n            word-break: normal;\n\n            code {\n                font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\n                background: transparent;\n                border: none;\n                padding: 0;\n                white-space: pre;\n                word-break: normal;\n            }\n        }\n    }\n\n    :deep(.ff-code-block--header) {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: 0.3rem 1rem;\n        background: var(--ff-color-bg-surface-raised);\n        border-bottom: 1px solid var(--ff-color-border);\n        min-height: 2rem;\n    }\n\n    :deep(.ff-code-block--lang) {\n        font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\n        font-size: 0.6875rem;\n        color: var(--ff-color-text-subtle);\n        text-transform: lowercase;\n    }\n\n    :deep(.ff-code-block--copy) {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        padding: 4px;\n        background: transparent;\n        border: none;\n        border-radius: 4px;\n        cursor: pointer;\n        color: var(--ff-color-accent-text);\n        transition: all 0.2s ease;\n\n        svg {\n            width: 1.5rem;\n            height: 1.5rem;\n            pointer-events: none;\n        }\n\n        &:hover {\n            color: var(--ff-color-text-on-brand);\n            background-color: var(--ff-color-accent);\n        }\n    }\n\n    :deep(code) {\n        padding: 0;\n        border: none;\n        border-radius: 0;\n    }\n\n    :deep(.ff-table-block) {\n        margin: 0.75rem 0;\n        border: 1px solid var(--ff-color-border);\n        border-radius: 0.5rem;\n        overflow: hidden;\n    }\n\n    :deep(.ff-table-block--header) {\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        padding: 0.3rem 1rem;\n        background: var(--ff-color-bg-surface-raised);\n        border-bottom: 1px solid var(--ff-color-border);\n        min-height: 2rem;\n    }\n\n    :deep(.ff-table-block--copy) {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        padding: 4px;\n        background: transparent;\n        border: none;\n        border-radius: 4px;\n        cursor: pointer;\n        color: var(--ff-color-accent-text);\n        transition: all 0.2s ease;\n\n        svg {\n            width: 1.5rem;\n            height: 1.5rem;\n            pointer-events: none;\n        }\n\n        &:hover {\n            color: var(--ff-color-text-on-brand);\n            background-color: var(--ff-color-accent);\n        }\n    }\n\n    :deep(table) {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 0.8125rem;\n\n        th {\n            text-align: left;\n            font-weight: 600;\n            background: var(--ff-color-bg-surface);\n        }\n\n        td, th {\n            padding: 0.375rem 0.75rem;\n            border: 1px solid var(--ff-color-border);\n        }\n\n        tbody tr:hover {\n            background: var(--ff-color-bg-surface);\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.guide-header {\n    .guide-title {\n        font-size: 1.125rem; // text-lg\n        font-weight: 600; // font-semibold\n        color: var(--ff-color-text-strong); // text-gray-900\n        margin: 0 0 0.5rem 0; // mb-2\n    }\n\n    .guide-summary {\n        color: var(--ff-color-text-muted); // text-gray-700\n        margin: 0 0 1rem 0; // mb-4\n        line-height: 1.625;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.message-bubble {\n    padding: 0.5rem 1rem;\n    word-wrap: break-word;\n    overflow-wrap: break-word;\n    border-radius: 0.5rem;\n\n    &.ai-message {\n        justify-content: flex-start;\n        background-color: var(--ff-color-bg-surface-raised);\n        color: var(--ff-color-text);\n        border-bottom-left-radius: 0.125rem;\n    }\n\n    &.message-bubble--bare {\n        padding: 0;\n\n        &.ai-message {\n            background-color: transparent;\n        }\n    }\n\n    &.human-message {\n        background-color: var(--ff-color-accent);\n        color: var(--ff-color-text-on-brand);\n        border-bottom-right-radius: 0.125rem;\n        width: fit-content;\n        align-self: end;\n    }\n\n    &.system-message {\n        justify-content: center;\n        font-size: 0.875rem;\n        line-height: 1.5;\n\n        &.system-warning {\n            background-color: var(--ff-color-status-warning-bg);\n            color: var(--ff-color-status-warning-text);\n            border-radius: 0.5rem;\n            text-align: left;\n            max-width: 100%;\n            width: 100%;\n        }\n\n        &.system-expired {\n            background-color: var(--ff-color-status-error-bg);\n            color: var(--ff-color-danger-darker);\n        }\n    }\n}\n\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section-title {\n    font-size: 1rem; // text-base\n    font-weight: 500; // font-medium\n    color: var(--ff-color-text-strong); // text-gray-900\n    margin: 0 0 0.75rem 0; // mb-3\n}\n\n.guide-flows {\n    .resources-grid {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section-title {\n    font-size: 1rem; // text-base\n    font-weight: 500; // font-medium\n    color: var(--ff-color-text-strong); // text-gray-900\n    margin: 0 0 0.75rem 0; // mb-3\n}\n\n.guide-steps {\n    margin-bottom: 1rem; // mb-4\n\n    .steps-list {\n        list-style: none;\n        padding: 0;\n        margin: 0;\n        display: flex;\n        flex-direction: column;\n        gap: 0.75rem; // space-y-3\n    }\n\n    .step-item {\n        display: flex;\n        align-items: flex-start;\n    }\n\n    .step-number {\n        flex-shrink: 0;\n        width: 1.5rem; // w-6\n        height: 1.5rem; // h-6\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        background-color: var(--ff-color-accent);\n        color: var(--ff-color-text-on-brand);\n        font-size: 0.875rem; // text-sm\n        border-radius: 50%; // rounded-full\n        margin-right: 0.75rem; // mr-3\n        margin-top: 0.125rem; // mt-0.5\n    }\n\n    .step-content {\n        flex: 1;\n\n        .step-title {\n            font-size: 1rem;\n            font-weight: 500;\n            color: var(--ff-color-text-strong);\n            margin: 0 0 0.25rem 0;\n        }\n\n        .step-detail {\n            font-size: 0.875rem;\n            color: var(--ff-color-text-deep);\n            margin: 0.25rem 0 0 0;\n            line-height: 1.5;\n        }\n    }\n}\n\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.issues {\n    margin-top: 1.25rem;\n\n    h4 {\n        font-weight: bold;\n        display: flex;\n        align-items: center;\n        gap: 5px;\n        color: var(--ff-color-text-deep);\n\n        .ff-icon {\n            color: var(--ff-color-text-subtle);\n        }\n    }\n\n    ul {\n        list-style: disc;\n        padding-left: 1.4rem;\n\n        li {\n            margin-top: .5rem;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.package-card {\n    display: flex;\n    align-items: flex-start;\n    gap: 0.5rem;\n    padding: 0.75rem;\n    background-color: var(--ff-color-bg-app);\n    border: 1px solid var(--ff-color-border);\n    border-radius: 0.5rem;\n    text-decoration: none;\n    color: var(--ff-color-text-strong);\n    transition: all 0.2s ease;\n\n    &:hover {\n        border-color: var(--ff-color-accent-light);\n        background-color: var(--ff-color-bg-surface);\n    }\n}\n\n.package-favicon {\n    flex-shrink: 0;\n    width: 1rem;\n    height: 1rem;\n    margin-top: 0.125rem;\n    vertical-align: middle;\n    margin-right: 0.5rem;\n}\n\n.package-info {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n}\n\n.package-text {\n    flex: 1;\n    min-width: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 0.125rem;\n}\n\n.package-actions {\n    flex-shrink: 0;\n}\n\n.package-name {\n    font-size: 0.875rem;\n    font-weight: 500;\n    font-family: monospace;\n    color: var(--ff-color-text-strong);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    :deep(.streamable-content) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n}\n\n.package-url {\n    font-size: 0.75rem;\n    color: var(--ff-color-text-subtle);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    margin: 0;\n\n    :deep(.streamable-content) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section-title {\n    font-size: 1rem; // text-base\n    font-weight: 500; // font-medium\n    color: var(--ff-color-text-strong); // text-gray-900\n    margin: 0 0 0.75rem 0; // mb-3\n}\n\n.guide-packages {\n    .packages-list {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n// Render like a normal answer: no card border/background, just the plan content\n// followed by the action buttons. The gap spaces the buttons from the content.\n// The plan content inherits the message bubble's font-size, line-height and\n// colour, so the Markdown renders exactly like any other chat answer.\n.expert-plan {\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n}\n\n.plan-actions {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 8px;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.expert-questions {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n}\n\n.question-block {\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n}\n\n.question-head {\n    display: flex;\n    flex-direction: column;\n    gap: 0.25rem;\n}\n\n.question-title {\n    font-size: 1rem;\n    font-weight: 500;\n    color: var(--ff-color-text-strong);\n    margin: 0;\n}\n\n.question-hint {\n    font-size: 0.75rem;\n    font-style: italic;\n    color: var(--ff-color-text-subtle);\n}\n\n.options-multi {\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n}\n\n// The checkbox slot renders both the label and (optionally) its description; stack them.\n.option-label {\n    display: block;\n}\n\n.option-description {\n    display: block;\n    margin-top: 2px;\n    font-weight: 400;\n    font-size: 0.8125rem;\n    line-height: 1.4;\n    color: var(--ff-color-text-subtle);\n}\n\n.questions-actions {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.resource-card {\n    display: flex;\n    align-items: flex-start;\n    gap: 0.5rem;\n    padding: 0.75rem;\n    background-color: var(--ff-color-bg-app);\n    border: 1px solid var(--ff-color-border);\n    border-radius: 0.5rem;\n    text-decoration: none;\n    color: var(--ff-color-text-strong);\n    transition: all 0.2s ease;\n\n    &:hover {\n        border-color: var(--ff-color-accent-light);\n        background-color: var(--ff-color-bg-surface);\n    }\n}\n\n.resource-icon {\n    flex-shrink: 0;\n    width: 1rem;\n    height: 1rem;\n    margin-top: 0.125rem;\n    object-fit: contain;\n}\n\n.resource-info {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 0.25rem;\n    min-width: 0;\n}\n\n.resource-title {\n    font-size: 0.875rem;\n    font-weight: 500;\n    color: var(--ff-color-text-strong);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    :deep(.streamable-content) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n}\n\n.resource-url {\n    font-size: 0.75rem;\n    color: var(--ff-color-text-subtle);\n    margin: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    :deep(.streamable-content) {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.section-title {\n    font-size: 1rem; // text-base\n    font-weight: 500; // font-medium\n    color: var(--ff-color-text-strong); // text-gray-900\n    margin: 0 0 0.75rem 0; // mb-3\n}\n\n.guide-resources {\n    .resources-grid {\n        display: flex;\n        flex-direction: column;\n        gap: 0.5rem;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.suggestions {\n    margin-top: 1.25rem;\n\n    h4 {\n        font-weight: bold;\n        display: flex;\n        align-items: center;\n        gap: 5px;\n        color: var(--ff-color-text-deep);\n\n        .ff-icon {\n            color: var(--ff-color-text-subtle);\n        }\n    }\n\n    ul {\n        list-style: disc;\n        padding-left: 1.4rem;\n\n        li {\n            margin-top: .5rem;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.json-viewer {\n    border: 1px solid var(--ff-color-border);\n    border-radius: 4px;\n    overflow: hidden;\n    background: var(--ff-color-bg-surface);\n}\n\n.json-viewer__header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 2px 8px;\n    background: var(--ff-color-bg-emphasis);\n    border-bottom: 1px solid var(--ff-color-border);\n}\n\n.json-viewer__label {\n    font-size: 0.75rem;\n    font-weight: 600;\n    color: var(--ff-color-text-subtle);\n}\n\n.json-viewer__collapse-toggle {\n    font-weight: 600;\n    color: var(--ff-color-text-subtle);\n}\n\n.json-viewer__caret {\n    width: 1rem;\n    height: 1rem;\n    transition: transform 0.2s ease;\n\n    &--open {\n        transform: rotate(90deg);\n    }\n}\n\n.json-viewer__wrap-toggle {\n    margin-left: auto;\n}\n\n.json-viewer__scroll {\n    overflow-x: auto;\n}\n\n.json-viewer__content {\n    margin: 0;\n    padding: 8px;\n    font-family: monospace;\n    font-size: 0.8125rem;\n    white-space: pre;\n}\n\n.json-viewer__scroll--wrap .json-viewer__content {\n    white-space: pre-wrap;\n    word-break: break-all;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.expert-tool-approval {\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n    padding: 0.75rem;\n    border: 1px solid var(--ff-color-border);\n    border-radius: 6px;\n    background: var(--ff-color-bg-surface);\n    // Match the \"N tool calls\" strip (ToolCalls.vue) so the card lines up with it.\n    max-width: 90%;\n}\n\n.tool-approval-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.tool-approval-name {\n    font-weight: 600;\n}\n\n.tool-approval-tag {\n    font-size: 0.75rem;\n    padding: 1px 6px;\n    border-radius: 4px;\n    &.tag-read { background: var(--ff-color-bg-emphasis); color: var(--ff-color-text-subtle); }\n    &.tag-write { background: var(--ff-color-status-info-bg); color: var(--ff-color-status-info-text); }\n    &.tag-delete { background: var(--ff-color-status-error-bg); color: var(--ff-color-status-error-text); }\n}\n\n.tool-approval-actions {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: 8px;\n}\n\n.tool-approval-outcome {\n    margin: 0;\n    font-weight: 600;\n    color: var(--ff-color-text-subtle);\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-expert-tool-call--item {\n    display: flex;\n    flex-direction: column;\n    gap: 0.25rem;\n}\n\n.ff-expert-tool-call--title {\n    font-size: 0.875rem;\n    font-weight: 600;\n    color: var(--ff-color-text);\n}\n\n.ff-expert-tool-call--name {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 0.375rem;\n    font-size: 0.75rem;\n    color: var(--ff-color-text-subtle);\n    font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\n}\n\n.ff-expert-tool-call--badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 1.25rem;\n    height: 1.125rem;\n    padding: 0 0.25rem;\n    font-size: 0.5625rem;\n    font-weight: 700;\n    color: var(--ff-color-text-deep);\n    background-color: var(--ff-color-bg-emphasis);\n    border-radius: 0.1875rem;\n    flex-shrink: 0;\n    cursor: help;\n}\n\n.ff-expert-tool-call--details {\n    margin-top: 0.5rem;\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n}\n\n.ff-expert-tool-call--section {\n    border: 1px solid var(--ff-color-border);\n    border-radius: 0.375rem;\n    overflow: hidden;\n}\n\n.ff-expert-tool-call--section-header {\n    display: flex;\n    align-items: center;\n    gap: 0.375rem;\n    padding: 0.5rem 0.75rem;\n    background-color: var(--ff-color-bg-app);\n    cursor: pointer;\n    user-select: none;\n    font-size: 0.75rem;\n    font-weight: 500;\n    color: var(--ff-color-text-deep);\n\n    &:hover {\n        background-color: var(--ff-color-bg-surface);\n    }\n\n    .ff-icon-small {\n        width: 0.75rem;\n        height: 0.75rem;\n        color: var(--ff-color-text-subtle);\n        flex-shrink: 0;\n        transition: transform 0.2s ease;\n\n        &.rotated {\n            transform: rotate(90deg);\n        }\n    }\n}\n\n.ff-expert-tool-call--section-label {\n    flex: 1;\n}\n\n.ff-expert-tool-call--section-duration {\n    color: var(--ff-color-text-subtle);\n    font-weight: 400;\n}\n\n.ff-expert-tool-call--code {\n    pre {\n        margin: 0;\n        padding: 0.75rem;\n        background-color: var(--ff-color-bg-surface-raised);\n        border-radius: 0.375rem;\n        overflow-x: auto;\n\n        code {\n            font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;\n            font-size: 0.8125rem;\n            color: var(--ff-color-text);\n            white-space: pre-wrap;\n            word-break: break-word;\n            border: none;\n            background: transparent;\n            padding: 0;\n        }\n    }\n\n    // When inside a section, remove border-radius top and add border\n    .ff-expert-tool-call--section & {\n        border-top: 1px solid var(--ff-color-border);\n\n        pre {\n            border-radius: 0;\n        }\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-expert-tool-call {\n    background-color: var(--ff-color-bg-surface);\n    border: 1px solid var(--ff-color-border);\n    border-radius: 0.5rem 0.5rem 0.5rem 0;\n    overflow: hidden;\n    max-width: 90%;\n}\n\n.ff-expert-tool-call--header {\n    display: flex;\n    align-items: center;\n    padding: 0.75rem 1rem;\n    gap: 0.5rem;\n    background-color: var(--ff-color-bg-app);\n    cursor: pointer;\n    user-select: none;\n\n    &:hover {\n        background-color: var(--ff-color-bg-surface);\n    }\n\n    .ff-icon {\n        width: 1rem;\n        height: 1rem;\n        color: var(--ff-color-text-subtle);\n        flex-shrink: 0;\n        transition: transform 0.2s ease;\n\n        &.rotated {\n            transform: rotate(90deg);\n        }\n    }\n}\n\n.ff-expert-tool-call--count {\n    font-size: 1rem;\n    font-weight: 500;\n    color: var(--ff-color-text);\n    flex: 1;\n}\n\n.ff-expert-tool-call--duration {\n    font-size: 1rem;\n    color: var(--ff-color-text-subtle);\n}\n\n.ff-expert-tool-call--body {\n    --item-height: 3rem;\n    border-top: 1px solid var(--ff-color-border);\n    padding: 0.75rem 1rem;\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n    max-height: calc(var(--item-height) * 2 + 1.5rem);\n    overflow-y: auto;\n    transition: max-height 0.2s ease;\n\n    &.is-expanded {\n        max-height: calc(var(--item-height) * 15 + 1.5rem);\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.message-wrapper {\n    margin-bottom: 0.5rem;\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.mode-switcher-floating {\n    position: absolute;\n    top: 1rem;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 1;\n    background: var(--ff-color-bg-app);\n    border-radius: 8px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n\n.info-banner {\n    background-color: var(--ff-color-accent-surface); // indigo-100\n    border-radius: 0.5rem;\n    margin-bottom: 1.5rem;\n    padding: 0.75rem 1rem;\n\n    .info-text {\n        color: var(--ff-color-accent-hover); // indigo-700\n        font-size: 0.875rem;\n        margin: 0;\n        line-height: 1.5;\n    }\n\n    .info-link {\n        color: inherit;\n        text-decoration: underline;\n\n        &:hover {\n            color: var(--ff-color-accent-text); // indigo-800\n        }\n    }\n\n    .beta-badge {\n        display: inline-block;\n        background-color: var(--ff-color-accent); // indigo-400\n        color: var(--ff-color-text-on-brand);\n        font-size: 0.625rem;\n        font-weight: 600;\n        padding: 0.125rem 0.375rem;\n        border-radius: 0.25rem;\n        text-transform: uppercase;\n        letter-spacing: 0.025em;\n        cursor: help;\n        vertical-align: text-top;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.update-banner {\n    background-color: var(--ff-color-accent-surface); // indigo-100\n    margin-bottom: 0rem;\n    border-radius: 0;\n    padding: 0.5rem 1rem;\n    border-top: 1px solid var(--ff-color-border);\n\n    .update-banner-text {\n        color: var(--ff-color-accent-hover); // indigo-700\n        font-size: 0.875rem;\n        margin: 0;\n        line-height: 1.5;\n    }\n\n    .update-banner-header {\n        font-weight: 600;\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n    }\n\n    .update-banner-body {\n        max-height: 0;\n        overflow: hidden;\n        visibility: hidden;\n        transition: max-height 0.6s ease-in-out, visibility 0.6s ease-in-out;\n        transition-delay: 250ms; // avoid showing immediately (minimise false expansion on mousing around the chat)\n    }\n\n    .update-banner-badge {\n        display: inline-block;\n        background-color: var(--ff-color-accent); // indigo-400\n        color: var(--ff-color-text-on-brand);\n        font-weight: 600;\n        border-radius: 0.25rem;\n        text-transform: uppercase;\n        letter-spacing: 0.025em;\n        cursor: default;\n        vertical-align: text-top;\n        padding: 0.125rem 0.5rem;\n        font-size: 0.75rem;\n    }\n\n    &.warning {\n        .update-banner-badge {\n            background-color: var(--ff-color-danger-darker);\n            color: var(--ff-color-text-on-brand);\n        }\n    }\n\n    &:hover .update-banner-body,\n    &:focus-within .update-banner-body,\n    &:active .update-banner-body {\n        max-height: 500px;\n        visibility: visible;\n    }\n}\n","@use \"@/ui-components/stylesheets/ff-colors.scss\" as *;@use \"@/ui-components/stylesheets/ff-utility.scss\" as *;\n\n.ff-expert {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    background: var(--ff-color-bg-app);\n    overflow: hidden; // Prevent this container from scrolling\n    position: relative;\n}\n\n.messages-container {\n    flex: 1;\n    overflow-y: auto;\n    padding: 1rem; // p-4\n    scroll-behavior: smooth;\n    min-height: 0; // Important for flex child overflow\n\n    // Custom scrollbar styling\n    &::-webkit-scrollbar {\n        width: 8px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background: transparent;\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: var(--ff-color-border-strong);\n        border-radius: 4px;\n\n        &:hover {\n            background-color: var(--ff-color-text-subtle);\n        }\n    }\n}\n\n.empty-state {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 100%;\n    text-align: center;\n    padding: 2rem;\n    color: var(--ff-color-text-deep);\n\n    .empty-state-icon {\n        width: 4rem;\n        height: 4rem;\n        margin-bottom: 1rem;\n        color: var(--ff-color-accent);\n\n        svg {\n            width: 100%;\n            height: 100%;\n        }\n    }\n\n    h3 {\n        font-size: 1.5rem;\n        font-weight: 600;\n        color: var(--ff-color-text-strong);\n        margin: 0 0 0.5rem 0;\n    }\n\n    p {\n        font-size: 1rem;\n        margin: 0;\n        max-width: 400px;\n    }\n}\n\n.scroll-anchor {\n    height: 1px;\n}\n\n.messages-container.has-mode-switcher {\n    padding-top: 4rem; // Extra padding to account for floating mode switcher\n}\n"],"names":[],"sourceRoot":""}