/* Detail changes preserve each saved world rectangle. */
.card-icon { display: none; }
.card-icon svg, .fallback-kind svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.fallback-kind { display: block; width: 36px; height: 36px; }
.workspace-card[data-presentation="compact"] { cursor: default; }
.workspace-card[data-presentation="compact"] .card-handle,
.workspace-card[data-presentation="compact"] .resize-handle,
.workspace-card[data-presentation="compact"] .fallback-name { display: none; }
.workspace-card[data-presentation="compact"][data-kind="file"] .preview-slot { pointer-events: none; }
.workspace-card[data-presentation="icon"] { padding: 0; background: color-mix(in srgb, CanvasText 8%, Canvas); cursor: pointer; }
.workspace-card[data-presentation="icon"] .card-handle,
.workspace-card[data-presentation="icon"] .preview-slot,
.workspace-card[data-presentation="icon"] .resize-handle { display: none; }
.workspace-card[data-presentation="icon"] .card-icon { display: block; pointer-events: auto; cursor: pointer; position: absolute; width: var(--icon-size); height: var(--icon-size); left: 50%; top: 50%; transform: translate(-50%, -50%); color: color-mix(in srgb, CanvasText 65%, Canvas); }
.pencil-tools[hidden] { display: none; }

/* A small workspace can retain detailed contents without offering layout edits. */
#viewport[data-presentation="compact"] .workspace-card:not([data-presentation="icon"]) { cursor: default; }
#viewport[data-presentation="compact"] .resize-handle,
#viewport[data-presentation="compact"] .grip { display: none; }

/* Mark an openable workspace without changing its layout or intercepting input. */
#viewport[data-presentation="compact"]::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 4;
  border: 2px solid transparent;
  border-radius: inherit;
  pointer-events: none;
}
@media (hover: hover) {
  #viewport[data-presentation="compact"]:hover::after { border-color: var(--accent); }
}
#viewport[data-presentation="compact"]:focus-visible::after { border-color: var(--accent); }