.callout-node{border-radius:.5rem;border-style:solid;border-width:1px;margin:1.5rem 0;padding:1rem;transition:all .2s ease}.callout-wrapper{position:relative}.callout-wrapper .ProseMirror-selectednode{outline:2px solid #3b82f6;outline-offset:2px}.callout-controls{align-items:center;border-bottom:1px solid;border-bottom-color:inherit;display:flex;gap:.5rem;margin-bottom:.75rem;opacity:.8;padding-bottom:.75rem}.callout-header{align-items:flex-start;display:flex;gap:.5rem}.callout-icon{flex-shrink:0;height:1.5rem;margin-top:.125rem;width:1.5rem}.callout-body{flex:1}.callout-title{font-size:1.125rem;font-weight:600;line-height:1.4;margin-bottom:.375rem}.callout-content{font-size:1rem;line-height:1.6}.callout-content p{margin:0}.callout-content p+p{margin-top:.5rem}.callout-node[data-callout-type=tip]{background-color:#dbeafe;border-color:#93c5fd}.callout-node[data-callout-type=tip] .callout-icon{color:#2563eb}.callout-node[data-callout-type=tip] .callout-title{color:#1e3a8a}.callout-node[data-callout-type=tip] .callout-content{color:#1e40af}.callout-node[data-callout-type=warning]{background-color:#fef3c7;border-color:#fde047}.callout-node[data-callout-type=warning] .callout-icon{color:#ca8a04}.callout-node[data-callout-type=warning] .callout-title{color:#713f12}.callout-node[data-callout-type=warning] .callout-content{color:#854d0e}.callout-node[data-callout-type=success]{background-color:#d1fae5;border-color:#86efac}.callout-node[data-callout-type=success] .callout-icon{color:#16a34a}.callout-node[data-callout-type=success] .callout-title{color:#14532d}.callout-node[data-callout-type=success] .callout-content{color:#166534}.callout-node[data-callout-type=error]{background-color:#fee2e2;border-color:#fca5a5}.callout-node[data-callout-type=error] .callout-icon{color:#dc2626}.callout-node[data-callout-type=error] .callout-title{color:#7f1d1d}.callout-node[data-callout-type=error] .callout-content{color:#991b1b}.callout-node[data-callout-type=info]{background-color:#f9fafb;border-color:#e5e7eb}.callout-node[data-callout-type=info] .callout-icon{color:#4b5563}.callout-node[data-callout-type=info] .callout-title{color:#111827}.callout-node[data-callout-type=info] .callout-content{color:#1f2937}.dark .callout-node[data-callout-type=tip]{background-color:#172554;border-color:#1e40af}.dark .callout-node[data-callout-type=tip] .callout-icon{color:#60a5fa}.dark .callout-node[data-callout-type=tip] .callout-title{color:#dbeafe}.dark .callout-node[data-callout-type=tip] .callout-content{color:#93c5fd}.dark .callout-node[data-callout-type=warning]{background-color:#422006;border-color:#92400e}.dark .callout-node[data-callout-type=warning] .callout-icon{color:#facc15}.dark .callout-node[data-callout-type=warning] .callout-title{color:#fef9c3}.dark .callout-node[data-callout-type=warning] .callout-content{color:#fde047}.dark .callout-node[data-callout-type=success]{background-color:#052e16;border-color:#166534}.dark .callout-node[data-callout-type=success] .callout-icon{color:#4ade80}.dark .callout-node[data-callout-type=success] .callout-title{color:#dcfce7}.dark .callout-node[data-callout-type=success] .callout-content{color:#86efac}.dark .callout-node[data-callout-type=error]{background-color:#450a0a;border-color:#991b1b}.dark .callout-node[data-callout-type=error] .callout-icon{color:#f87171}.dark .callout-node[data-callout-type=error] .callout-title{color:#fee2e2}.dark .callout-node[data-callout-type=error] .callout-content{color:#fca5a5}.dark .callout-node[data-callout-type=info]{background-color:#030712;border-color:#1f2937}.dark .callout-node[data-callout-type=info] .callout-icon{color:#9ca3af}.dark .callout-node[data-callout-type=info] .callout-title{color:#f3f4f6}.dark .callout-node[data-callout-type=info] .callout-content{color:#d1d5db}.callout-title.cursor-pointer:hover,.callout-title[contenteditable=true]:hover{opacity:.8}.callout-content:focus-within{outline:none}.callout-controls button{transition:all .15s ease}.callout-controls button:hover{transform:translateY(-1px)}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.callout-node{animation:slideIn .3s ease-out}@media (max-width:640px){.callout-node{margin:1rem 0;padding:.75rem}.callout-header{gap:.5rem}.callout-icon{height:1rem;width:1rem}.callout-title{font-size:.875rem}.callout-content{font-size:.8125rem}}