.codebox{position:relative;background:#f4f5f7;border:1px solid #e2e5ea;border-radius:5px;overflow:hidden;margin:1em 0}
.codebox__toolbar{display:flex;align-items:center;justify-content:flex-end;padding:6px 8px;background:#f4f5f7;border-bottom:1px solid #e2e5ea}
.codebox__btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid #d1d5db;background:#fff;border-radius:5px;cursor:pointer}
.codebox__btn:hover{background:#f9fafb}
.codebox__btn:active{transform:translateY(1px)}
.codebox__btn-icon{width:16px;height:16px;display:inline-block;background:currentColor;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path d="M16 1H4a2 2 0 0 0-2 2v12h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z"/></svg>') center/contain no-repeat}
.codebox__content{padding:8px;overflow:auto;max-height:70vh}
.codebox__content code{white-space:pre;display:block;color:#1f2937}
.codebox__toast{position:absolute;right:10px;top:8px;background:#111827;color:#fff;border-radius:5px;padding:6px 8px;opacity:0;transform:translateY(-6px);transition:opacity .2s,transform .2s}
.codebox__toast.is-show{opacity:1;transform:translateY(0)}