.project-title-extension,
.extension-actions,
.extension-studio { display: none; }

body.mode-extension { background: #141616; }
body.mode-extension .project-title-extension { display: grid; }
body.mode-extension .extension-actions { display: flex; }
body.mode-extension .project-title-launcher,
body.mode-extension .project-title-box,
body.mode-extension .project-title-ornament,
body.mode-extension .ornament-actions,
body.mode-extension .box-actions { display: none !important; }
body.mode-extension .studio-shell,
body.mode-extension .box-studio,
body.mode-extension .module-launcher,
body.mode-extension .showroom-dock { display: none !important; }
body.mode-extension .extension-studio {
  display: grid;
  grid-template-columns: 268px minmax(480px, 1fr) 318px;
  min-height: 0;
  grid-row: 2 / 4;
}

.extension-library-panel { padding: 18px; overflow: auto; }
.extension-library-panel .panel-heading { margin-bottom: 18px; }
.extension-description { color: var(--cream-muted); font-size: .64rem; line-height: 1.65; }
.extension-feature-list { display: grid; gap: 10px; margin: 22px 0; padding: 18px 0; border-block: 1px solid var(--line); }
.extension-feature-list div { display: grid; grid-template-columns: 26px 1fr; gap: 8px; align-items: center; }
.extension-feature-list span { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid var(--line); color: var(--brass-light); font: .62rem Georgia, serif; }
.extension-feature-list strong { font-size: .62rem; }
.extension-feature-list small { color: var(--cream-muted); font-size: .54rem; line-height: 1.35; }
.extension-production-note { padding: 13px; border: 1px solid rgba(184, 130, 68, .3); background: rgba(86, 57, 31, .24); color: var(--cream-muted); font-size: .56rem; line-height: 1.55; }
.extension-production-note strong { display: block; margin-bottom: 5px; color: var(--cream); font-size: .62rem; }

.extension-workspace { grid-template-rows: 58px minmax(0, 1fr) 61px; }
.extension-canvas-wrap { position: relative; min-height: 0; display: grid; place-items: center; overflow: auto; padding: 30px; background: linear-gradient(rgba(179,137,83,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(179,137,83,.07) 1px,transparent 1px),radial-gradient(circle at 50% 44%,rgba(103,80,54,.38),transparent 55%),#121313; background-size: 24px 24px,24px 24px,100% 100%,100% 100%; }
.extension-canvas-wrap::before { content: ""; position: absolute; inset: 15px; border: 1px solid rgba(219,177,119,.17); pointer-events: none; }
#extensionPreview { position: relative; z-index: 1; width: min(94%, 980px); max-height: 92%; overflow: visible; border: 1px solid rgba(215,181,132,.38); background: rgba(240,223,194,.055); box-shadow: 0 18px 55px rgba(0,0,0,.34),inset 0 0 60px rgba(0,0,0,.22); transform-origin: center; transition: transform .16s ease; }
#extensionPreviewCut path { fill: rgba(223,190,140,.055); stroke: #f1dfc3; stroke-width: 1.05; vector-effect: non-scaling-stroke; }
#extensionPreviewCut path:hover { fill: rgba(210,153,83,.19); stroke: #ffdca8; }
#extensionPreviewEngrave path { fill: none; stroke: #69b9b5; stroke-width: .72; stroke-dasharray: 3 2; vector-effect: non-scaling-stroke; pointer-events: none; }
.extension-loading { position: absolute; z-index: 4; left: 50%; top: 50%; translate: -50% -50%; padding: 12px 16px; border: 1px solid var(--line-strong); background: rgba(14,14,13,.94); color: var(--cream); font-size: .62rem; box-shadow: var(--shadow); }

.extension-inspector-panel { padding: 15px; overflow: auto; }
.extension-controls { display: grid; gap: 11px; margin-top: 12px; }
.extension-control { display: grid; gap: 6px; color: var(--cream-muted); font-size: .58rem; }
.extension-control > span:first-child { color: var(--cream); font-weight: 650; }
.extension-control input,
.extension-control select { width: 100%; }
.extension-check-row { margin: 2px 0; }
.extension-export-card { margin-top: 18px; }
.extension-export-card button { width: 100%; }

@media (max-width: 1100px) {
  body.mode-extension .extension-studio { display: flex; flex-direction: column; overflow: auto; }
  .extension-workspace { order: -1; min-height: 520px; height: 68vh; }
  .extension-library-panel,
  .extension-inspector-panel { overflow: visible; }
}

@media (max-width: 900px) {
  body.mode-extension .project-title-extension { display: none; }
  body.mode-extension .extension-studio { grid-row: 2; }
}

@media (max-width: 680px) {
  body.mode-extension .extension-actions .compact-action { display: none; }
  .extension-workspace { min-height: 440px; height: 62vh; }
  .extension-canvas-wrap { padding: 18px; }
  .extension-statusbar > div:nth-child(4) { display: none; }
}