/* Equal work areas: knowledge canvas and an ordered website mockup. */
.developerShell .webWorkspaceSpacesV3 .puzzleSplitStudio{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:0;overflow:hidden}
.puzzleResourcesHalf{display:grid;grid-template-rows:minmax(240px,1fr) 190px;min-width:0;min-height:0;background:#18191d}
.puzzleResourcesHalf .webSpacesCanvasPane{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.puzzleResourcesHalf .webSpacesCanvasToolbar{position:relative!important;inset:auto!important;flex:0 0 auto;flex-wrap:wrap;gap:7px;padding:10px;width:auto!important}
.puzzleResourcesHalf .webSpacesCanvasToolbar>div{flex-wrap:wrap}
.puzzleResourcesHalf .webSpacesCanvas{flex:1;min-height:0;height:auto!important}
.puzzleModulesTitle{font-size:14px;color:#fff;margin-right:8px}
.puzzleResourceShelf{padding:12px 16px;border-top:1px solid #ffffff20;min-height:0;overflow:auto;color:#ececf1}
.puzzleResourceShelf header{display:flex;flex-wrap:wrap;gap:5px 14px;align-items:baseline;margin-bottom:10px}
.puzzleResourceShelf header b{font-size:12px}.puzzleResourceShelf small{font-size:11px;color:#a5a7b2}
.puzzleResourceList{display:flex;gap:8px;flex-wrap:wrap}
.puzzleResource{display:flex;align-items:center;gap:8px;border:1px solid #41424a;border-radius:8px;padding:7px 10px;background:#282a31;color:#eee;font:inherit;font-size:12px;max-width:245px;min-width:140px;text-align:left;cursor:grab;touch-action:none}
.puzzleResource:hover{border-color:#b7aaed;background:#34303e}.puzzleResource>span:not(.puzzleMediaGlyph){min-width:0;overflow-wrap:anywhere}.puzzleResource small{display:block;margin-top:2px}.puzzleResource>b{margin-left:auto;color:#b8b2ca}
.puzzleResource img,.puzzleResource .puzzleMediaGlyph{width:38px;height:38px;object-fit:cover;flex-shrink:0;border-radius:4px}.puzzleMediaGlyph{display:grid;place-items:center;background:#e6e1f1;color:#625075;font-size:20px}.puzzleResourceGlyph{font-size:21px;color:#cec1f9}
.puzzleNodeHandle{touch-action:none;cursor:grab!important}
.puzzleModuleTabs{position:relative;inset:auto;flex:0 0 auto;align-self:flex-start;margin:0 12px 10px;z-index:5;display:flex;gap:6px;flex-wrap:wrap;padding:4px;border:1px solid #3c3c48;border-radius:8px;background:#1d1e24;width:max-content;max-width:calc(100% - 24px)}.puzzleModuleTabs button{border:0;border-radius:5px;padding:7px 9px;background:transparent;color:#bfc0ce;font:600 11px system-ui;cursor:pointer}.puzzleModuleTabs button.active{background:#4d3f63;color:#fff}.puzzleModuleTabs small{opacity:.65;font-size:10px;margin-left:3px}.puzzleResourcesHalf .webSpacesLibrary{top:155px!important}.puzzleGlobalBadge{font-size:9px;color:#c2a9e2;background:#ffffff08;padding:5px 6px;border-radius:5px}.puzzleModuleKindSelect{display:grid;gap:7px;margin-bottom:12px;color:#c5bed1;font-size:11px}.puzzleModuleKindSelect select{padding:8px;background:#26232e;color:#e4deef;border:1px solid #5d526d;border-radius:5px;width:100%;font-size:11px}.puzzleMoreModules{width:100%;min-width:0;padding:7px;border:1px solid #41424a;background:#25262e;color:#ddd;border-radius:6px;font-size:10px}
.developerShell .puzzleStructureHalf{display:flex!important;position:relative!important;inset:auto!important;width:auto!important;height:auto!important;max-height:none!important;transform:none!important;z-index:auto!important;flex-direction:column;min-height:0;min-width:0;background:#efede9!important;color:#24232a;border-left:1px solid #bbb5ad}
.puzzlePanelHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 22px;background:#faf9f6;border-bottom:1px solid #d8d5ce;flex-shrink:0}.puzzlePanelHeader h2{margin:3px 0 0;font-size:25px;color:#24232a}.puzzlePanelHeader .eyebrow{font-size:10px;color:#746956}
.puzzleStudioEditor{overflow:auto;min-height:0;flex:1;padding:18px 22px;scrollbar-gutter:stable}
.puzzleEditorFields{border:0;padding:0;margin:0;min-width:0}.puzzleEditorFields:disabled{opacity:.65}
.puzzleGuide{font-size:13px;line-height:1.6;color:#595760;margin:0 0 15px}
.puzzleProposeInline{padding:13px;border:1px solid #d4d0c8;border-radius:9px;background:#faf9f6;display:grid;gap:9px}.puzzleProposeInline small{font-size:11px;line-height:1.5;color:#6f6975}.puzzleProposeInline .btn{justify-self:start}
.puzzleStructureHalf label{display:grid;gap:6px;font-size:12px;color:#57515e;font-weight:600}
.puzzleStructureHalf input,.puzzleStructureHalf textarea,.puzzleStructureHalf select{min-width:0;width:100%;padding:9px 10px;border:1px solid #d2cdd8;border-radius:6px;background:#fff;color:#25212d;font-family:inherit;font-size:13px;box-sizing:border-box}
.puzzleStructureHalf textarea{resize:vertical;min-height:66px;line-height:1.5}.puzzleStructureHalf :is(button,input,textarea,select):focus-visible{outline:3px solid #8261c1;outline-offset:2px}
.puzzleStructureHalf .btn{background:#fff;color:#40364d;border:1px solid #c7c0ce;font-size:12px;line-height:1.3;padding:8px 11px;white-space:normal}.puzzleStructureHalf .btn.primary{background:#59417d;border-color:#59417d;color:white}.puzzleStructureHalf .btn:disabled{opacity:.45;cursor:default}
.puzzlePageTabs{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0 12px}.puzzlePageTabs button{padding:8px 12px;border:1px solid #c7c0ce;border-radius:7px;background:transparent;color:#51445f;font:inherit;font-size:12px;cursor:pointer}.puzzlePageTabs .active{background:#59417d;color:#fff;border-color:#59417d}
.puzzlePageMock{border:1px solid #c4bfc9;border-radius:10px;background:#fff;box-shadow:0 8px 28px #24202c0c;overflow:hidden}
.puzzleBrowserBar{display:flex;align-items:center;gap:5px;background:#e5e1e9;padding:10px 13px}.puzzleBrowserBar i{width:7px;height:7px;border-radius:100%;background:#b7aebf}.puzzleBrowserBar span{background:#f7f5f9;border-radius:4px;padding:3px 12px;margin:0 20px;flex:1;font-size:11px;color:#62596d;overflow-wrap:anywhere}
.puzzlePageSettings{padding:12px 16px;border-bottom:1px solid #ded9e3}.puzzlePageSettings summary,.puzzleSectionSettings summary,.puzzleRationale summary{font-size:12px;color:#6b5f76;cursor:pointer}.puzzlePageSettings[open],.puzzleSectionSettings[open]{display:grid;gap:10px}.puzzlePageSettings label,.puzzleSectionSettings label{margin-top:10px}
.puzzleInsert{padding:7px 15px;text-align:center;border:2px solid transparent;min-height:31px}.puzzleInsert .btn{border:0;background:transparent;font-size:11px;color:#80668f;padding:5px 10px}
.puzzleMockSection{margin:0 14px;border:1px solid #d6cfdf;border-radius:8px;overflow:hidden;background:#fbfafe}
.puzzleMockSection>header{display:flex;align-items:center;gap:6px;background:#efebf4;padding:10px}.puzzleMockSection>header input{font-size:14px;font-weight:700;background:transparent;border-color:transparent;padding:6px 2px;flex:1;width:80px}.puzzleMockSection>header .btn{padding:5px 7px;flex-shrink:0}
.puzzleDragHandle{touch-action:none;cursor:grab;border:0;background:transparent;font-size:24px;color:#7a6689;padding:2px 4px}.puzzleNumber{font-size:10px;color:#85728f}
.puzzlePlaced{display:flex;flex-wrap:wrap;gap:8px;padding:12px}.puzzlePlacedModule{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ede7f5;border:1px solid #d8cce8;border-radius:6px;padding:9px 10px;color:#584073;font-size:13px;flex:1 1 150px;overflow-wrap:anywhere}
.puzzlePlaced button:not(.btn){border:0;border-radius:4px;background:transparent;color:#66556e;padding:4px 7px;font-size:16px;cursor:pointer}.puzzlePlaced button:hover{background:#ddd3e5}
.puzzlePlacedAsset{display:flex;align-items:center;gap:8px;border:1px solid #d9d3df;border-radius:6px;overflow:hidden;font-size:11px;color:#5a5260;min-width:0;flex:1 1 170px}.puzzlePlacedAsset>span:not(.puzzleMediaGlyph){min-width:0;overflow-wrap:anywhere;flex:1}.puzzlePlacedAsset img,.puzzlePlacedAsset .puzzleMediaGlyph{width:76px;height:62px;object-fit:cover;flex-shrink:0}.puzzleEmptySection{width:100%;border:1px dashed #c9bbd5;border-radius:5px;padding:20px 10px;color:#8c7a9b;text-align:center;font-size:12px}
.puzzleInstruction{padding:0 12px 12px}.puzzleSectionSettings{border-top:1px solid #e3dde9;padding:10px 12px}.puzzleSectionSettings .btn{margin-top:10px}
.puzzleRationale{margin-top:12px}.puzzleRationale p{font-size:12px;line-height:1.6;color:#67616d}
.puzzleStudioFooter{background:#faf9f6;border-top:1px solid #d2ccd8;padding:11px 18px;flex-shrink:0}.puzzleStudioFooter>span{font-size:11px;color:#766982;display:block;margin-bottom:7px}.puzzleStudioFooter>div{display:flex;flex-wrap:wrap;gap:7px}.puzzleStudioFooter .primary{margin-left:auto}
.puzzleStart{padding:30px 15px;text-align:center;border:1px dashed #b6a7c4;border-radius:9px;color:#685277}.puzzleStart b{font-size:20px}.puzzleStart p{font-size:13px;line-height:1.6}
.puzzleDropActive{outline:3px solid #9766c7!important;outline-offset:-3px;background:#eee0ff!important}.puzzleDragGhost{position:fixed;z-index:20000;pointer-events:none;max-width:240px;padding:12px 17px;border:1px solid #bb98e0;background:#59417d;color:#fff;border-radius:8px;box-shadow:0 8px 30px #0004;font:600 13px system-ui}
.developerPreviewPhase .webSpacesPreviewStage{height:65vh;min-height:420px}.developerPreviewPhase .webSpacesPreviewPane{width:100%}.developerPreviewPhase>.webSpacesToolbar{margin-bottom:16px}
@media(max-width:760px){.developerShell .webWorkspaceTop{grid-template-columns:auto minmax(0,1fr)!important;height:auto!important;flex-basis:auto!important;min-height:90px;padding:10px!important}.developerShell .webWorkspaceActions{grid-column:1/-1;justify-content:flex-start}.developerShell #developerCostBadge{display:inline-flex!important}}
@media(max-width:760px){.developerShell .webWorkspaceSpacesV3 .puzzleSplitStudio{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:530px minmax(700px,auto)!important;overflow:auto}.developerShell .webWorkspaceSpacesV3 .webSpacesFullscreenShell:has(.puzzleSplitStudio){height:auto;min-height:calc(100vh - 100px);overflow:visible}.developerShell .webWorkspaceSpacesV3 .puzzleSplitStudio{height:auto;min-height:1230px}.puzzleResourcesHalf{grid-template-rows:340px 190px}.puzzleStructureHalf{border-left:0!important;border-top:1px solid #bbb5ad}.puzzleStudioEditor{max-height:900px;padding:12px}.puzzlePanelHeader{padding:14px}.puzzleStudioFooter{padding:12px}.puzzleMockSection{margin:0 8px}.puzzleMockSection>header{gap:2px;padding:7px}.puzzleNumber{display:none}.puzzleResource{min-width:130px;max-width:165px}.puzzleResourceShelf{padding:10px}.puzzleStudioFooter .primary{margin-left:0}.developerPreviewPhase .webSpacesPreviewStage{min-height:360px}.puzzleResourcesHalf .webSpacesCanvasToolbar{padding:8px}.puzzleResourcesHalf .webSpacesCanvasToolbar>div{flex-wrap:wrap}}