.annotation-example{grid-column:1/-1;border:1px solid #d7ddd8;border-radius:20px;background:white;overflow:hidden;box-shadow:0 16px 45px rgba(18,34,29,.08)}
.annotation-browser{height:34px;display:flex;align-items:center;gap:5px;padding:0 13px;background:#eef1ed;border-bottom:1px solid #dce1dc}.annotation-browser>span{width:7px;height:7px;border-radius:50%;background:#bdc6c0}.annotation-browser>span:first-child{background:#ed8d68}.annotation-browser small{margin-left:7px;color:#718079;font-size:9px}
.annotation-head{display:flex;align-items:end;justify-content:space-between;gap:15px;padding:22px 25px 17px}.annotation-head p{margin:0 0 5px;color:var(--orange);font-size:8px;font-weight:800;letter-spacing:.1em}.annotation-head h4{margin:0;font:700 22px Manrope;letter-spacing:-.04em}.annotation-head>span{padding:6px 9px;border-radius:9px;background:var(--mint);color:var(--green);font-size:10px;font-weight:800}
.annotation-content{display:grid;grid-template-columns:1.35fr .65fr;gap:14px;padding:0 25px 20px}.annotation-gallery{min-width:0}.annotation-gallery img{display:block;width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:12px}.annotation-gallery>div{display:grid;grid-template-columns:repeat(3,1fr);text-align:center;color:var(--muted);font-size:8px;font-weight:700;padding-top:7px}
.annotation-panel{padding:16px;border-radius:13px;background:#f3f7f4}.annotation-label{margin:0;color:var(--green);font-size:8px;font-weight:800;letter-spacing:.1em}.annotation-panel blockquote{margin:9px 0 14px;font:600 13px/1.5 Manrope,sans-serif}.annotation-panel dl{margin:0;display:grid;gap:7px}.annotation-panel dl>div{display:grid;grid-template-columns:82px 1fr;gap:7px}.annotation-panel dt{color:var(--muted);font-size:8px}.annotation-panel dd{margin:0;font-size:8px;font-weight:700}
.annotation-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 25px;background:var(--ink);color:#c2d0ca;font-size:8px}.annotation-footer span{color:var(--lime)}.annotation-footer strong{font-size:8px}
@media(max-width:700px){.annotation-head{padding:16px}.annotation-head h4{font-size:17px}.annotation-content{grid-template-columns:1fr;padding:0 16px 15px}.annotation-panel{padding:13px}.annotation-footer{align-items:flex-start;flex-direction:column;padding:10px 16px}.annotation-panel blockquote{font-size:12px}}
.annotation-example .annotation-footer{width:100%;margin:0;border:0}
