.twoip-editor-link{
  width:500px;
  max-width:calc(100vw - 24px);
  border:1px solid var(--twoip-outline-variant);
  background:var(--twoip-surface);
  color:inherit;
  padding:18px;
  box-shadow:0 8px 24px color-mix(in srgb, var(--twoip-on-surface) 26.667%, transparent);
}
.twoip-editor-link::backdrop{
  background:color-mix(in srgb, var(--twoip-scrim) 33.333%, transparent);
}
.twoip-editor-link label{display:block;margin:8px 0}
.twoip-editor-link input{display:block;width:100%;box-sizing:border-box}
.twoip-editor-link button{margin:10px 8px 0 0}

/* One editor surface and toolbar across all first-party consumers. */
.twoip-bbcode-editor { border:1px solid var(--twoip-outline-variant); position:relative; background:var(--twoip-surface); border-radius:var(--twoip-radius-small,8px); overflow:hidden; min-width:0; text-align:start; }
.twoip-editor-toolbar { float:none; display:flex; flex-wrap:wrap; width:auto; height:auto; min-height:44px; padding:4px; border-right:0; border-bottom:1px solid var(--twoip-outline-variant); background:var(--twoip-surface-container); overflow:visible; }
.twoip-editor-group { display:flex; flex-direction:row; border:0; }
.twoip-editor-tool { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin:0; padding:0; box-sizing:border-box; border:1px solid transparent; background:none; color:var(--twoip-on-surface); font:inherit; box-shadow:none; border-radius:var(--twoip-radius-small,8px); }
.twoip-editor-symbol { display:inline-flex; align-items:center; justify-content:center; position:static; margin:0; font-size:18px; line-height:1; }
.twoip-editor-tool.twoip-editor-active { box-shadow:none; background:var(--twoip-primary-container); color:var(--twoip-primary); }
.twoip-editor-source-tool { position:static; margin-inline-start:auto; padding-inline-start:var(--twoip-service-option-row-gap,8px); border-inline-start:1px solid var(--twoip-outline-variant); }
.twoip-editor-text { margin:0; padding:0; }
.twoip-editor-body,.twoip-editor-source { box-sizing:border-box; padding:16px!important; text-align:start; line-height:1.5; }
.twoip-editor-resize { display:block; }

.twoip-editor-body{overflow:auto;outline:none;font:inherit;line-height:1.5}
.twoip-editor-source{display:block;width:100%;border:0!important;margin:0!important;resize:none;font:inherit;outline:none}
.twoip-editor-source[hidden],.twoip-editor-body[hidden]{display:none}
.twoip-editor-resize{height:8px;cursor:ns-resize;touch-action:none}
.twoip-editor-tool:focus-visible,.twoip-editor-resize:focus-visible{outline:2px solid var(--twoip-primary);outline-offset:-2px}
.twoip-editor-tool:hover,.twoip-editor-resize:hover{background:var(--twoip-surface-container-high)}
.twoip-editor-tool:disabled{opacity:.3}
.twoip-editor-toolbar .twoip-editor-source-tool .twoip-editor-tool{width:auto;gap:var(--twoip-service-option-row-gap,8px);padding-inline:8px}
/* Semantic content is distinct from neutral form/status text. Keep nested formats. */
.twoip-editor-body :is(b,strong) { font-weight:700; }
.twoip-editor-body :is(i,em) { font-style:italic; }
.twoip-editor-body u { text-decoration:underline; }
.twoip-editor-body ol { list-style-type:decimal; }
.twoip-editor-body ul { list-style-type:disc; }
.twoip-editor-body :is(ol,ul) { padding-inline-start:1.5em; }
.twoip-editor-body li { display:list-item; }
.twoip-editor-body a { color:var(--twoip-primary); text-decoration:underline; }

/* A single component focus contour; paint never changes layout geometry. */
.twoip-bbcode-editor:focus-within { border-color:var(--twoip-primary); box-shadow:0 0 0 1px var(--twoip-primary); }
.twoip-bbcode-editor .twoip-editor-body,.twoip-bbcode-editor .twoip-editor-source { border:0!important; outline:none!important; box-shadow:none!important; }