.builder-dialog,.record-dialog:has(.composer-designer) { width:min(1080px,calc(100vw - 40px)) }
.message-dialog-subtitle { display:block;margin-top:5px;color:var(--muted);font:400 13px/1.5 "Segoe UI",sans-serif }
.message-save-context { display:grid;gap:3px;margin-right:auto;max-width:55%;font-size:13px }
.message-draft-state { font-weight:600 }
.message-save-context small { color:var(--muted);font-size:12px }
.builder-dialog .composer { padding:16px }
.command-dialog:has(.composer-designer) .record-body { padding:0 16px 16px }
.command-dialog:has(.composer-designer) .command-panel { padding-top:12px }
.composer-designer .composer-workspace { display:block;border:1px solid #1e1f22;border-radius:12px;background:#313338;min-width:0 }
.composer-stage { min-width:0;background:#313338;border-radius:11px;color:#dbdee1;color-scheme:dark;position:relative;max-height:calc(100dvh - 240px);min-height:340px;overflow:auto;scrollbar-color:#1e1f22 #2b2d31;overscroll-behavior:contain }
.composer-channel { display:flex;align-items:center;gap:10px;padding:10px 20px;border-bottom:1px solid #26272b;background:#313338;position:sticky;top:0;z-index:15 }
.composer-channel>.icon { width:22px;height:22px;color:#949ba4 }
.composer-channel>strong { font:600 15px/1.4 "gg sans","Segoe UI",sans-serif;color:#f2f3f5 }
.composer-channel>.actions-inline { margin-left:auto;gap:4px;flex-wrap:nowrap }
.composer-channel>.actions-inline>.button { min-height:30px;padding:5px 9px;background:transparent;border-color:transparent;box-shadow:none;color:#dbdee1;font-size:12px }
.composer-channel>.actions-inline>.button:hover:not(:disabled) { background:#ffffff1a;color:#fff }
.composer-channel .info-button.button { color:#b5bac1 }
.composer-channel .info-button.button:hover,.composer-channel .info-button.button[aria-expanded="true"] { color:#fff;background:#ffffff1a }
.composer-designer .composer-canvas { padding:24px 20px 0;border:0;border-radius:0;background:#313338;min-height:0 }
.composer-designer .discord-preview { max-width:none;padding:0 0 8px;margin:0;min-height:100px }
.composer-designer .discord-content { min-width:0 }
.composer-designer .designer-block { position:relative;outline:1px solid transparent;outline-offset:4px;scroll-margin:84px 0 30px }
.composer-designer .designer-block.discord-block { overflow:visible }
.composer-designer .designer-block:hover:not(:has(.designer-block:hover)),.composer-designer .designer-block:focus-visible { outline-color:#717783 }
.composer-designer .designer-block.is-selected { outline:1px solid #a6adff }
.composer-designer .designer-block>.discord-accent { border-radius:8px 0 0 8px }
.composer-designer [data-inline-text] { cursor:text;min-height:24px;outline:none;white-space:normal;caret-color:#fff;scroll-margin:84px 0 30px }
.composer-designer [data-inline-text].is-empty:before { content:attr(data-placeholder);color:#949ba4;position:absolute;pointer-events:none;font:400 16px/1.375 "gg sans","Segoe UI",sans-serif }
.composer-designer [data-inline-text].is-empty>p:only-of-type { min-height:24px }
.composer-designer [data-inline-text]::selection,.composer-designer [data-inline-text] ::selection { background:#5865f280 }
.designer-variable { border-radius:3px;background:#5865f229;box-shadow:0 1px 0 #a6adff80;cursor:default }
.composer-designer .designer-block.discord-separator { min-height:1px;cursor:pointer;overflow:visible }
.composer-designer .designer-block.discord-separator:after { content:"";position:absolute;inset:-7px 0 }
.composer-designer .designer-block.discord-spoiler { overflow:visible }
.composer-designer .designer-block.discord-spoiler>.spoiler-content { display:block }
.composer-designer .designer-block.is-disabled { opacity:.65 }
.composer-designer .designer-block.discord-gallery { overflow:visible }
.composer-designer .discord-gallery-item { border-radius:8px }
.composer-designer .discord-gallery .preview-image { border-radius:8px }
.composer-designer .discord-thumbnail { cursor:pointer }
.composer-designer .designer-block.discord-thumbnail { overflow:visible }
.composer-designer .discord-thumbnail .preview-image { border-radius:8px }
.composer-designer .canvas-block-tools { position:absolute;bottom:calc(100% + 6px);right:0;display:flex;align-items:center;gap:2px;padding:3px;background:#1e1f22;color:#dbdee1;border:1px solid #4e5058;border-radius:7px;z-index:10;opacity:0;visibility:hidden;pointer-events:none;white-space:nowrap;box-shadow:0 4px 12px #0003 }
.composer-designer .canvas-block-tools>span { font:500 11px/1.2 "Segoe UI",sans-serif;padding:0 5px }
.composer-designer .designer-block:hover:not(:has(.designer-block:hover))>.canvas-block-tools,
.composer-designer .designer-block.is-selected>.canvas-block-tools,
.composer-designer .designer-block:focus-within:not(:has(.designer-block:focus-within))>.canvas-block-tools { opacity:1;visibility:visible;pointer-events:auto }
.canvas-control.button { display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:28px;min-height:28px;width:28px;height:28px;padding:5px;border:0;box-shadow:none;border-radius:4px;background:transparent;color:inherit;cursor:pointer }
.canvas-control.button>.icon { width:16px;height:16px }
.canvas-control.button:hover { background:#ffffff1a;color:#fff }
.canvas-control.button:focus-visible,.canvas-add.button:focus-visible,.canvas-side-prompt.button:focus-visible { outline:2px solid #a6adff;outline-offset:3px }
.canvas-control.canvas-grip { cursor:grab;touch-action:none }
.canvas-control.canvas-grip:active { cursor:grabbing }
.canvas-control.canvas-grip:disabled { display:none }
.composer-designer .canvas-accent.button { position:absolute;left:-9px;top:8px;width:20px;height:calc(100% - 16px);min-height:24px;min-width:0;border:0;border-radius:7px;background:transparent;z-index:2;opacity:.7;padding:0 }
.composer-designer .canvas-accent.button>.icon { width:16px;height:16px;position:absolute;top:0;left:1px;opacity:0;background:#1e1f22;border-radius:4px }
.composer-designer .canvas-accent.button:hover,.composer-designer .canvas-accent.button:focus-visible { background:#a6adff33;opacity:1 }
.composer-designer .canvas-accent.button:hover>.icon,.composer-designer .canvas-accent.button:focus-visible>.icon { opacity:1 }
.composer-designer .discord-block:not(.has-accent)>.canvas-accent { border-left:2px dashed #656873 }
.canvas-add.button { display:flex;align-items:center;justify-content:center;gap:6px;min-height:30px;padding:5px 10px;border:1px dashed #656873;background:transparent;box-shadow:none;color:#b5bac1;font:500 12px/1.4 "Segoe UI",sans-serif;border-radius:5px;cursor:pointer }
.canvas-add.button>.icon { width:15px;height:15px }
.canvas-add.button:hover { color:#fff;border-color:#a6adff;background:#5865f21a }
.composer-designer .designer-block>.canvas-add,.composer-designer .discord-section-text>.canvas-add { align-self:flex-start;margin-top:8px }
.composer-designer .discord-row>.canvas-add { margin:0;min-width:32px;min-height:32px }
.composer-designer .canvas-add.is-compact { padding:4px }
.composer-additions { padding:8px 20px 24px 76px;margin:0 }
.composer-additions>.canvas-add { width:100%;min-height:40px }
.canvas-side-prompt.button { flex:none;align-self:flex-start;display:flex;flex-direction:column;gap:6px;width:80px;height:80px;padding:8px;border:1px dashed #656873;background:#232428;color:#b5bac1;border-radius:8px;font:400 11px/1.3 "Segoe UI",sans-serif;white-space:normal }
.canvas-side-prompt.button:hover { color:#fff;border-color:#a6adff;background:#383a40 }
.canvas-side-prompt>.icon { width:24px;height:24px }
.canvas-image-prompt.button { color:#b5bac1;background:#232428;border:1px dashed #656873;min-height:80px }
.canvas-empty-message { color:#b5bac1;font:400 16px/1.5 "Segoe UI",sans-serif;padding:16px 0 }
.designer-popover { position:fixed;inset:auto;margin:0;padding:16px;width:350px;max-width:calc(100vw - 24px);max-height:min(70dvh,620px);overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:0 12px 48px #0005;z-index:100;font:400 13px/1.5 "Segoe UI",sans-serif }
.designer-popover::backdrop { background:transparent }
.designer-popover>header { display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:10px }
.designer-popover>header h3 { font-size:14px;margin:0 }
.designer-popover .canvas-control:hover { background:var(--wash);color:var(--ink) }
.designer-popover .block-fields { padding:0 }
.designer-popover .block-fields>.field-row { grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 0 }
.designer-popover .block-fields textarea { min-height:140px;max-height:250px;line-height:1.5;resize:vertical }
.designer-popover .block-fields>.field-row .field-control { min-width:0 }
.designer-popover .block-actions { padding:12px 0 0;margin-top:12px;gap:8px }
.designer-popover .block-actions .button,.designer-popover .block-actions select { font-size:12px;min-height:34px }
.designer-popover .block-text-help,.designer-popover .block-note,.designer-popover .block-variables small { font-size:12px;line-height:1.5;color:var(--muted) }
.designer-popover .block-variables { display:grid;gap:8px }
.canvas-component-menu { display:grid;grid-template-columns:1fr 1fr;gap:6px }
.canvas-component-option.button { display:flex;align-items:flex-start;justify-content:flex-start;gap:8px;padding:10px 8px;text-align:left;white-space:normal;border:0;background:transparent;box-shadow:none }
.canvas-component-option.button:hover { background:var(--wash) }
.canvas-component-option>.icon { width:18px;height:18px;flex:none;margin-top:2px }
.canvas-component-option strong { display:block;font-size:12px }
.canvas-component-option small { display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:3px }
.canvas-variable-menu,.canvas-accessory-menu { display:grid;gap:4px }
.canvas-variable-menu>.button { justify-content:flex-start }
.composer-designer.is-dragging { cursor:grabbing;user-select:none }
.composer-designer.is-dragging .canvas-block-tools { visibility:hidden;pointer-events:none }
.composer-designer .drag-source { opacity:.25;outline:1px dashed #a6adff }
.canvas-drag-ghost { position:fixed;left:0;top:0;pointer-events:none;z-index:1000;max-height:220px;overflow:hidden;opacity:.9;padding:12px;background:#313338;color:#dbdee1;border:1px solid #a6adff;border-radius:8px;box-shadow:0 10px 30px #0006;will-change:transform }
.canvas-drop-indicator { position:fixed;pointer-events:none;z-index:1001;border-radius:4px;background:#a6adff;color:#fff;font:500 11px/1.3 "Segoe UI",sans-serif;text-indent:8px;line-height:26px;white-space:nowrap;text-shadow:0 1px 3px #000 }
.canvas-drop-indicator:before,.canvas-drop-indicator:after { content:"";position:absolute;top:-2px;width:7px;height:7px;border-radius:50%;background:#a6adff }
.canvas-drop-indicator:before { left:0 }.canvas-drop-indicator:after { right:0 }
.canvas-drop-indicator.is-vertical { text-indent:10px }
.component-composer-canvas { padding:0 16px 16px;min-width:0 }
.component-composer-import { display:flex;gap:8px;flex-wrap:wrap }
.component-composer-import input { flex:1 1 240px;min-width:0 }
.component-composer-status,.component-composer-target { margin:12px 20px;overflow-wrap:anywhere }
.component-composer-status:empty,.component-composer-target:empty { display:none }
.component-composer>.notice { margin:16px 20px }
.component-composer>.validation-errors { margin:16px 20px }
.component-composer>.settings-section-actions { display:flex;gap:10px;flex-wrap:wrap }
@media(max-width:600px) {
  .builder-dialog,.record-dialog:has(.composer-designer) { width:calc(100vw - 16px) }
  .builder-dialog .composer { padding:10px }
  .command-dialog:has(.composer-designer) .record-body { padding:0 10px 10px }
  .composer-stage { max-height:calc(100dvh - 250px);min-height:260px }
  .composer-channel { padding:10px 12px;gap:6px }
  .composer-channel>strong { font-size:13px }
  .composer-channel>.actions-inline>.button { padding:4px 6px }
  .composer-designer .composer-canvas { padding:20px 12px 0 }
  .composer-designer .discord-preview { padding:8px 0;gap:8px }
  .composer-designer .discord-preview .discord-avatar { width:24px;height:24px }
  .composer-designer .discord-block { padding:12px }
  .composer-additions { padding:12px 12px 24px 44px }
  .canvas-side-prompt.button { width:60px;height:70px }
  .message-save-context { flex-basis:100%;max-width:none }
  .message-save-context small { font-size:11px }
  .builder-dialog .dialog-actions>.button { flex:1 }
}
@media(hover:none) {
  .composer-designer .canvas-block-tools { opacity:1;visibility:visible;pointer-events:auto;position:relative;bottom:auto;right:auto;align-self:flex-end;width:max-content;margin:8px 0 0 auto;box-shadow:none }
  .composer-designer .designer-block>.canvas-block-tools { display:flex }
}
@media(prefers-reduced-motion:reduce) { .canvas-drag-ghost { will-change:auto } }