.studio-tools-dialog { width:min(760px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:24px; border:1px solid #aecce3; border-radius:14px; background:#fff; color:#214761; box-shadow:0 12px 44px #17417b33; font-family:var(--rocode-font-family,system-ui,sans-serif); overflow:auto; }
.studio-tools-dialog::backdrop { background:#15355466; backdrop-filter:blur(3px); }
.studio-tools-dialog [hidden] { display:none !important; }
.rocode-brand-icon { display:inline-block; width:var(--rocode-brand-size,20px); height:var(--rocode-brand-size,20px); object-fit:contain; flex-shrink:0; vertical-align:-.2em; user-select:none; pointer-events:none; }
.rocode-brand-label { display:inline-flex; align-items:center; gap:.35em; vertical-align:middle; max-width:100%; }
.rocode-brand-label>span { min-width:0; }
.rocode-brand-label .rocode-brand-icon { align-self:center; }
.builder-workspace .toolbox-card .rocode-brand-icon { transition:transform 160ms ease; }
.builder-workspace .toolbox-card:hover .rocode-brand-icon { transform:scale(1.08); }
@media(prefers-reduced-motion:reduce) { .builder-workspace .toolbox-card .rocode-brand-icon { transition:none; } }
.studio-tools-heading { display:flex; align-items:flex-start; gap:20px; margin-bottom:22px; }
.studio-tools-heading>div { flex:1; min-width:0; }
.studio-tools-dialog h2 { margin:0 0 8px; font-size:26px; line-height:1.25; color:#163f65; }
.studio-tools-dialog h3 { margin:0 0 5px; font-size:18px; line-height:1.3; }
.studio-tools-dialog p { margin:0 0 16px; line-height:1.5; }
.studio-tools-heading p { margin-bottom:0; color:#61798d; }
.studio-tools-dialog button,.studio-tools-upload { display:inline-flex; justify-content:center; align-items:center; gap:8px; min-height:44px; padding:9px 15px; border:1px solid #3669fb; border-radius:6px; background:#f7fbff; color:#245bdd; font:600 15px/1.3 var(--rocode-font-family,system-ui,sans-serif); cursor:pointer; text-decoration:none; transition:background-color 160ms,border-color 160ms,box-shadow 160ms; }
.studio-tools-dialog button:hover,.studio-tools-upload:hover { background:#e7f1ff; }
.studio-tools-dialog button:disabled { cursor:default; color:#8c9bad; background:#f6f8fa; border-color:#d5e0e9; }
.studio-tools-dialog :is(button,input,select,textarea):focus-visible,.studio-tools-upload:focus-within { outline:3px solid #175ce3; outline-offset:3px; }
.studio-tools-heading>button { width:44px; flex-shrink:0; padding:10px; border-color:#bcd4e6; color:#48667f; }
.studio-tools-dialog label { display:grid; gap:6px; font-weight:600; font-size:15px; line-height:1.4; }
.studio-tools-dialog label span { font-weight:400; color:#668195; }
.studio-tools-dialog :is(input:not([type=checkbox]):not([type=file]),select,textarea) { width:100%; min-height:44px; padding:10px 12px; border:1px solid #bdd2e4; border-radius:6px; background:#fff; color:#244760; font:400 16px/1.4 var(--rocode-font-family,system-ui,sans-serif); }
.studio-tools-dialog textarea { resize:vertical; }
.studio-tools-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:16px 0; }
.studio-tools-actions>span { font-size:14px; color:#698094; margin-left:auto; }
.studio-tools-actions>label:has(select) { flex:1; }
.studio-tools-upload { position:relative; overflow:hidden; }
.studio-tools-upload input { position:absolute; width:100%; height:100%; inset:0; opacity:0; cursor:pointer; }
.studio-tools-dialog [data-status] { margin:16px 0 0; min-height:24px; font-size:14px; color:#48677f; }
.studio-tools-dialog [data-status][role=alert] { color:#a13a26; }
.studio-tools-empty { padding:30px 20px; text-align:center; background:#f0f8fe; border:1px dashed #bad5e9; border-radius:8px; }
.studio-tools-empty p { color:#698094; margin:0; }
.studio-tools-form .studio-tools-actions>button:first-child,.exhibition-export>button:first-child { background:#386afa; color:white; }
.backpack-list { display:grid; gap:12px; }
.backpack-card { display:flex; align-items:center; gap:14px; padding:16px; background:#f8fcff; border:1px solid #d0e1ee; border-radius:8px; }
.backpack-card>div:first-of-type { flex:1; min-width:0; }
.backpack-card h3 { overflow-wrap:anywhere; }
.backpack-card p { margin:0; color:#6a8395; font-size:14px; }
.backpack-card-icon { color:#8950ed; width:44px; height:44px; display:grid; place-items:center; background:#f1ebff; border-radius:9px; flex-shrink:0; }
.backpack-card-icon .ui-icon { width:26px; height:26px; }
.backpack-card-actions { display:flex; flex-wrap:wrap; gap:6px; }
.backpack-card-actions>button:not(:first-child) { width:44px; padding:10px; border-color:#c5d9e8; color:#527086; }
.exhibition-editor-list { display:grid; gap:16px; }
.exhibition-editor-card { border:1px solid #cbdfeE; border-top:4px solid #4c8dff; border-radius:8px; padding:16px; }
.exhibition-editor-card:nth-child(4n+2) { border-top-color:#ff9224; }
.exhibition-editor-card:nth-child(4n+3) { border-top-color:#74ae16; }
.exhibition-editor-card:nth-child(4n) { border-top-color:#b24eea; }
.exhibition-card-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.exhibition-card-heading>strong { overflow-wrap:anywhere; }
.exhibition-card-heading>div { display:flex; gap:6px; flex-shrink:0; }
.exhibition-card-heading button { width:40px; padding:8px; border-color:#c1d7e8; color:#50708a; }
.exhibition-fields { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.exhibition-wide { grid-column:1/-1; }
.studio-tools-dialog .exhibition-confirm { display:flex; align-items:flex-start; gap:10px; font-weight:400; }
.exhibition-confirm input { width:20px; height:20px; accent-color:#3669fb; flex-shrink:0; margin:1px 0 0; }
.studio-tools-dialog .exhibition-card-note { margin:14px 0 0; font-size:13px; color:#648095; }
.exhibition-export { position:sticky; bottom:-24px; margin:18px -24px -8px; padding:18px 24px; background:#fff; border-top:1px solid #d9e5ee; }
@media(max-width:580px) { .studio-tools-dialog { padding:18px; }.backpack-card { align-items:flex-start; flex-wrap:wrap; }.backpack-card-actions { width:100%; }.exhibition-fields { grid-template-columns:1fr; }.exhibition-card-heading { align-items:flex-start; }.exhibition-export { bottom:-18px; margin-inline:-18px; padding-inline:18px; } }
@media(prefers-reduced-motion:reduce) { .studio-tools-dialog button,.studio-tools-upload { transition:none; } }