.eb-host { min-width:0; grid-column:1 / -1; }
.eb { color-scheme:dark; --eb-bg:#313338; --eb-panel:#2b2d31; --eb-text:#dbdee1; --eb-muted:#b5bac1; --eb-border:#4e5058; color:var(--eb-text); background:var(--eb-bg); border:1px solid var(--eb-border); border-radius:8px; font:14px/1.5 system-ui,sans-serif; overflow-wrap:anywhere; min-width:0; margin:12px 0; }
.eb *, .eb *::before, .eb *::after { box-sizing:border-box; }
.eb [hidden] { display:none!important; }
.eb button { font:inherit; cursor:pointer; }
.eb button:disabled { cursor:default; opacity:.6; }
.eb button:focus-visible, .eb summary:focus-visible { outline:2px solid var(--accent-primary,#8b7cf8); outline-offset:3px; }
.eb-header { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid var(--eb-border); }
.eb-modes { display:flex; gap:3px; }
.eb .eb-button, .eb .eb-modes button { padding:5px 9px; border:1px solid var(--eb-border); border-radius:4px; color:var(--eb-text); background:transparent; font-size:12px; white-space:normal; min-width:0; }
.eb .eb-button:hover, .eb-modes button[aria-pressed=true] { background:#404249; }
.eb-message { padding:16px; }
.eb-identity { display:flex; gap:8px; align-items:center; margin-bottom:12px; font-size:13px; }
.eb-avatar { display:block; width:28px; height:28px; flex-shrink:0; border-radius:50%; object-fit:cover; background:var(--eb-panel); }
.eb-app-tag { background:#5865f2; color:#fff; font-size:10px; border-radius:3px; padding:1px 4px; }
.eb-embed { padding:14px; border-left:4px solid var(--accent-primary,#8b7cf8); border-radius:4px; background:var(--eb-panel); min-width:0; }
.eb-upper { display:flex; align-items:flex-start; gap:16px; }
.eb-copy { flex:1; min-width:0; }
.eb-thumbnail { flex:0 0 80px; min-width:0; }
.eb-slot { min-width:0; margin-bottom:10px; }
.eb .eb-display { display:block; width:100%; color:inherit; text-align:left; border:1px solid transparent; border-radius:4px; padding:4px; background:transparent; overflow-wrap:anywhere; }
.eb .eb-display:hover { border-color:var(--accent-primary,#8b7cf8); background:#383a40; }
.eb-placeholder { display:block; color:var(--eb-muted); font-size:12px; font-weight:400; }
.eb-display:has(.eb-placeholder) { border:1px dashed var(--eb-border); }
.eb-title { font-weight:600; font-size:17px; }
.eb-author { font-size:12px; font-weight:600; }
.eb-footer { font-size:12px; color:var(--eb-muted); }
.eb-rendered { padding:4px; }
.eb .eb-image img { display:block; max-width:100%; max-height:280px; border-radius:4px; }
.eb .eb-thumbnail img { display:block; max-width:100%; max-height:90px; margin:auto; object-fit:contain; border-radius:4px; }
.eb-thumbnail .eb-display { min-height:80px; text-align:center; }
.eb .eb-authorIcon img, .eb .eb-footerIcon img { width:24px; height:24px; object-fit:contain; }
.eb-upper:has(.eb-thumbnail .eb-input-area:not([hidden])) { flex-wrap:wrap; }
.eb-thumbnail:has(.eb-input-area:not([hidden])) { flex-basis:100%; }
.eb .eb-input-area { border:1px solid var(--accent-primary,#8b7cf8); border-radius:5px; background:var(--eb-bg); padding:8px; color:var(--eb-text); font-size:14px; font-weight:400; }
.eb .eb-input-label { display:block; color:var(--eb-muted); font-size:12px; margin:0 0 5px; }
.eb .eb-input { display:block; width:100%; max-width:100%; min-width:0; padding:8px; border:1px solid var(--eb-border); border-radius:4px; color:var(--eb-text); background:#1e1f22; font:14px/1.5 system-ui,sans-serif; margin:0; }
.eb textarea.eb-input { resize:vertical; min-height:90px; }
.eb .eb-input[type=color] { min-height:36px; }
.eb-input-footer, .eb-tools, .eb-format { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.eb-input-footer { justify-content:space-between; margin-top:7px; color:var(--eb-muted); font-size:11px; }
.eb-format { margin-bottom:6px; }
.eb-emojis { display:flex; flex-wrap:wrap; align-content:flex-start; gap:5px; padding:6px 2px; max-height:224px; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-gutter:stable; }
.eb-emojis button { flex:0 0 36px; width:36px; min-height:36px; padding:4px!important; font-size:18px!important; }
.eb .eb-block-format { width:auto; max-width:100%; border:1px solid var(--eb-border); border-radius:4px; padding:5px; color:var(--eb-text); background:var(--eb-panel); font:12px system-ui,sans-serif; }
.eb-tools { margin-top:12px; }
.eb-tools .eb-color { margin:0; }
.eb-color-picker { width:28px; height:28px; background:transparent; border:0; padding:0; }
.eb-timestamp { display:flex; align-items:center; gap:6px; color:var(--eb-muted); font-size:12px; }
.eb-timestamp input { width:auto; }
.eb-extras { margin-top:12px; color:var(--eb-muted); font-size:12px; }
.eb-extras summary { cursor:pointer; }
.eb-extra-fields { padding-top:8px; }
.eb-hint, .eb-status { padding:10px 16px; color:var(--eb-muted); font-size:12px; }
.eb-hint { border-top:1px solid var(--eb-border); }
.eb-status:empty { display:none; }
.eb .eb-error { color:#ffa6ad; }
.eb .eb-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.eb .eb-field { grid-column:1/-1; padding:0; border:0; background:transparent; margin:0; min-width:0; display:flex; flex-direction:column; }
.eb .eb-field.eb-inline { grid-column:auto; }
.eb .eb-field .field-header { order:3; margin:0; font-size:11px; display:flex; justify-content:space-between; }
.eb .eb-field .checkbox-group { order:2; display:flex; margin:0 0 5px; gap:6px; align-items:center; font-size:11px; }
.eb .eb-field .checkbox-group input { width:auto; }
.eb a, .eb-link { color:#8ba9ff; }
.eb code { background:#1e1f22; padding:1px 4px; border-radius:3px; }
.eb pre { white-space:pre-wrap; overflow-wrap:anywhere; background:#1e1f22; padding:8px; }
.eb blockquote { border-left:3px solid #6b6e77; padding-left:9px; margin:5px 0; }
.eb .discord-emoji { width:20px; height:20px; vertical-align:middle; object-fit:contain; }
.eb-spoiler { position:relative; background:#1e1f22; border-radius:3px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.eb-spoiler > .eb-spoiler-content { visibility:hidden; }
.eb-spoiler.is-revealed { background:#ffffff12; }
.eb-spoiler.is-revealed > .eb-spoiler-content { visibility:visible; }
.eb-spoiler > button.eb-spoiler-toggle { position:absolute; inset:0; width:100%; height:100%; min-height:0; min-width:0; border:0; border-radius:3px; padding:0; background:transparent; cursor:pointer; }
.eb .eb-md-heading { color:inherit; font-weight:700; line-height:1.25; border:0; padding:0; margin:12px 0 6px; text-transform:none; letter-spacing:normal; }
.eb .eb-md-heading:first-child { margin-top:0; }
.eb h1.eb-md-heading { font-size:24px; }
.eb h2.eb-md-heading { font-size:20px; }
.eb h3.eb-md-heading { font-size:16px; }
.eb .eb-subtext { display:block; color:var(--eb-muted); font-size:12px; line-height:1.4; }
.eb :is(ul,ol) { margin:4px 0; padding-left:24px; list-style-position:outside; }
.eb ul { list-style-type:disc; }
.eb ol { list-style-type:decimal; }
.eb li { display:list-item; margin:0; padding:0; }
.eb li > :is(ul,ol) { margin:0; }
.eb .image-upload-controls { max-width:100%; flex-wrap:wrap; }
.eb .image-upload-status { white-space:normal; overflow-wrap:anywhere; }
.eb-legacy-hidden { display:none!important; }
.embed-builder-container:has(> .eb-host) { display:block!important; }
.welcome-layout:has(.eb) { grid-template-columns:minmax(0,1fr); }
body[data-page="embed-builder"] .embed-action-bar .action-section { flex:1 1 auto; width:100%; min-width:0; flex-wrap:wrap; }
body[data-page="embed-builder"] .embed-action-bar .channel-selector { min-width:0; flex-wrap:wrap; flex-direction:row; }
body[data-page="embed-builder"] .embed-action-bar .channel-selector .custom-select-wrapper { min-width:0; flex:1 1 180px; }
.eb .eb-author-icon, .eb .eb-footer-icon { width:20px; height:20px; object-fit:contain; border-radius:50%; vertical-align:middle; margin-right:6px; }
.eb-footer-row { display:flex; flex-wrap:wrap; align-items:center; gap:4px; color:var(--eb-muted); font-size:12px; }
.eb-footer-row > .eb-footer { flex:0 1 auto; max-width:100%; margin-bottom:0; }
.eb-footer-row > .eb-footer:has(.eb-input-area:not([hidden])) { flex:1 0 100%; }
.eb-footer-separator { flex-shrink:0; }
.eb-timestamp-preview { color:var(--eb-muted); font-size:12px; padding:0 4px; }
@media(max-width:768px) {
  body[data-page="embed-builder"] .embed-action-bar .action-section { flex-direction:column; align-items:stretch; gap:12px; }
  body[data-page="embed-builder"] .embed-action-bar .channel-selector { flex:none; width:100%; flex-direction:column; align-items:stretch; gap:8px; }
  body[data-page="embed-builder"] .embed-action-bar .channel-selector label { white-space:normal; }
  body[data-page="embed-builder"] .embed-action-bar .channel-selector .custom-select-wrapper { flex:none; max-width:none; }
  body[data-page="embed-builder"] .embed-action-bar .action-clear { width:100%; margin-left:0; }
  body[data-page="embed-builder"] .embed-action-bar :is(.action-section,.action-clear) > .btn { width:100%; min-height:44px; justify-content:center; }
}
@media(max-width:600px) {
  .eb-message { padding:10px; } .eb-embed { padding:10px; } .eb-header { padding:10px; }
  .eb-upper { gap:10px; } .eb-thumbnail { flex-basis:64px; } .eb-thumbnail .eb-display { min-height:64px; padding:2px; } .eb-thumbnail .eb-placeholder { font-size:11px; }
  .eb .eb-fields { grid-template-columns:minmax(0,1fr); }
  .eb .eb-input { font-size:16px; }
  .eb-upper:has(.eb-input-area:not([hidden])) { flex-wrap:wrap; }
  .eb-upper:has(.eb-input-area:not([hidden])) .eb-copy { flex-basis:100%; }
}
@media(pointer:coarse) { .eb button { min-height:44px; } }
