.studio-safety{margin:0 0 22px;padding:16px 18px;border:1px solid #d8dedb;border-radius:12px;background:#f7f8f4;color:#24313b;display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px}
.studio-safety strong{font-weight:700}.studio-safety p{margin:3px 0 0;line-height:1.4}.studio-safety-actions{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto}.studio-action{display:inline-flex;align-items:center;justify-content:center;border:1px solid #bcc9c9;border-radius:8px;background:white;color:#213442;min-height:44px;padding:8px 12px;text-decoration:none;font:inherit;font-weight:600;cursor:pointer}.studio-action.primary{background:#173747;color:white;border-color:#173747}.studio-action:hover{border-color:#51717b}.studio-insights{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px 16px;padding-top:10px;border-top:1px solid #d8dedb}.studio-insights span{white-space:nowrap}.studio-safety-message{flex-basis:100%;font-weight:600}
@media(max-width:767px){.studio-safety{margin:12px 0 20px;padding:14px;display:block}.studio-safety-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:12px 0 0}.studio-safety-actions .primary{grid-column:1/-1}.studio-action{min-width:0;text-align:center}.dashboard-header{flex-wrap:wrap;gap:12px}.dashboard-header>*{min-width:0}.studio-insights{margin-top:12px}.pattern-generator,.colorway-generate,.dashboard-main{min-width:0;max-width:100%}}
.studio-signout,.studio-signout-mobile{display:inline-flex;align-items:center;justify-content:center;min-height:40px;border-radius:8px;border:1px solid #cbd4d3;background:#fff;color:#243743;text-decoration:none;font-size:14px;font-weight:650;white-space:nowrap}
.studio-signout{width:100%;padding:8px 12px}
.studio-signout:hover,.studio-signout-mobile:hover{background:#edf2f0;border-color:#809795}
.studio-signout:focus-visible,.studio-signout-mobile:focus-visible{outline:2px solid #173747;outline-offset:2px}
.studio-signout-mobile{display:none}
@media(max-width:767px){.mobile-studio-bar{display:flex;align-items:center;gap:8px}.studio-signout-mobile{display:inline-flex;margin-left:auto;padding:7px 12px;min-height:38px;font-size:13px}}

/* Preview remains visible while the editing columns scroll independently. */
@media(min-width:1101px){
 .editor-shell .studio-grid{align-items:start}
 .editor-shell .left-column,.editor-shell .right-column{position:sticky;top:20px;max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
 .editor-shell .middle-column{position:sticky;top:20px}
 .editor-shell .canvas-stage{height:clamp(300px,calc(100dvh - 180px),620px);min-height:300px}
}
@media(max-width:1100px){
 .editor-shell .middle-column{position:sticky;top:0;z-index:5;background:#f7f8fa}
 .editor-shell .canvas-stage{height:clamp(180px,32dvh,330px);min-height:180px;padding:16px}
 .editor-shell .left-column{max-height:65dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
 .editor-shell .left-panel{display:flex;flex-direction:column}
 .editor-shell .left-panel .palette-section{border-left:0;border-top:1px solid var(--border)}
}

.studio-onboarding{margin:18px 0;padding:20px;border:1px solid #cdd6d8;border-radius:10px;background:#f5f8f7;color:#24343b}.studio-onboarding summary{cursor:pointer;font-weight:700;font-size:17px}.studio-onboarding p{font-size:15px;line-height:1.6;margin:12px 0}.studio-onboarding ol{padding-left:22px;line-height:1.7}.studio-onboarding li{margin:8px 0}.studio-onboarding .studio-safety-actions{flex-wrap:wrap;margin-left:0}@media(max-width:767px){.studio-onboarding{padding:16px}.studio-onboarding .studio-action{white-space:normal;overflow-wrap:anywhere}}

.raster-drop.is-dragging{background:#eef4f5;border-color:#426b82;outline:2px solid #426b82;outline-offset:2px}.raster-drop strong{max-width:100%;overflow-wrap:anywhere}.raster-drop[aria-busy="true"]{cursor:progress}

.raster-dialog.is-dragging{outline:3px solid #426b82;outline-offset:-3px}.fabric-import-trigger.is-dragging{background:#eef4f5;border-color:#426b82;outline:2px solid #426b82;outline-offset:2px}