.comment-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 16px;font:400 14px/1.5 var(--body,Arial,sans-serif)}
.comment-invitation{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px;padding:16px;background:var(--paper,#f8f7f3);border-radius:10px}
.comment-invitation[hidden]{display:none!important}
.comment-invitation p{margin:0!important;font:600 16px/1.5 var(--body,Arial,sans-serif);color:var(--ink,#222824)}
.comment-invitation button{font:600 14px/1.5 var(--body,Arial,sans-serif);min-height:44px;border:1px solid var(--blue,#1c659f);border-radius:7px;padding:10px 14px;background:white;color:var(--blue,#1c659f);cursor:pointer}
.comment-invitation button:focus-visible{outline:3px solid var(--blue,#1c659f);outline-offset:3px}
.comment-unavailable{margin:0 0 16px;padding:12px 14px;border:1px solid var(--line,#d9ded7);border-radius:10px;background:var(--paper,#f8f7f3);font:400 14px/1.5 var(--body,Arial,sans-serif);color:var(--ink-soft,#50594c)}
.comment-modes{display:flex;gap:4px;background:var(--paper,#f8f7f3);padding:4px;border:1px solid var(--line,#d9ded7);border-radius:10px}
.comment-toolbar button,.comment-toolbar select,.comment-actions button{font:600 14px/1.5 var(--body,Arial,sans-serif);min-height:44px;border:0;border-radius:7px;padding:10px 14px;background:transparent;color:var(--ink,#222824);cursor:pointer}
.comment-modes button[aria-pressed=true]{background:var(--blue,#1c659f);color:#fff}
.comment-version-label{display:flex;align-items:center;gap:8px}.comment-toolbar select{border:1px solid var(--line,#d9ded7);background:white;max-width:180px}
.comment-editor[hidden],.comment-editor [hidden]{display:none!important}
.comment-hint{font:400 15px/1.6 var(--body,Arial,sans-serif);margin:0 0 12px!important;color:var(--ink-soft,#50594c)}
.comment-stage{position:relative;width:100%;max-width:944px;margin-inline:auto;line-height:0;cursor:crosshair;background:var(--paper,#f8f7f3);isolation:isolate;touch-action:pan-y}
.comment-image{width:100%;height:auto;display:block;pointer-events:none;user-select:none;border-radius:14px}
.comment-pins{position:absolute;inset:0;pointer-events:none;line-height:1.4}
.comment-pin{position:absolute;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;pointer-events:auto;z-index:3}
.comment-pin span{display:grid;place-items:center;width:32px;height:32px;border:2px solid #fff;border-radius:50% 50% 50% 4px;background:var(--blue,#1c659f);color:white;font:700 16px/1 var(--body,Arial,sans-serif);box-shadow:0 2px 8px #152c3d38}
.comment-bubble{position:absolute;display:flex;align-items:flex-start;min-height:38px;box-sizing:border-box;pointer-events:auto;border-radius:18px;background:white;border:1px solid #dbe3e9;box-shadow:0 3px 16px #18314524;z-index:2;overflow:hidden}
.comment-note.is-active .comment-bubble{z-index:5;border:2px solid var(--blue,#1c659f);border-radius:16px}
.comment-note.is-active .comment-pin{z-index:6}
.comment-mobile-number{display:none}
.comment-summary{font:400 14px/1.5 var(--body,Arial,sans-serif);display:block;width:100%;min-height:38px;padding:8px 13px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;border:0;background:white;color:var(--ink,#222824);text-align:left;cursor:pointer}
.comment-input{font:400 16px/1.5 var(--body,Arial,sans-serif);flex:1;min-width:0;width:100%;resize:none;padding:10px 0 10px 12px;color:var(--ink,#222824);border:0;background:#fff;outline:0;border-radius:16px}
.comment-editor .comment-summary,.comment-editor .comment-input{color:var(--ink,#222824)}
.comment-remove{width:38px;height:44px;flex:0 0 38px;padding:0;border:0;background:transparent;font:400 25px/1 Arial,sans-serif;color:#526575;cursor:pointer}
.comment-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:16px}
.comment-footer p{font:400 14px/1.6 var(--body,Arial,sans-serif);margin:0!important;flex:1;min-width:210px;color:var(--ink-soft,#50594c)}
.comment-actions{display:flex;gap:8px;align-items:center}.comment-actions .comment-apply{background:var(--blue,#1c659f);color:white}
.comment-editor button:disabled,.comment-toolbar button:disabled,.comment-toolbar select:disabled{opacity:.55;cursor:default}
.comment-editor button:focus-visible,.comment-toolbar button:focus-visible,.comment-toolbar select:focus-visible,.comment-stage:focus-visible{outline:3px solid var(--blue,#1c659f);outline-offset:3px}
.comment-mock{position:absolute;left:12px;bottom:12px;font:600 12px/1.4 var(--body,Arial,sans-serif);padding:5px 8px;border-radius:5px;color:white;background:#253444e6;pointer-events:none}
@media(max-width:600px){.comment-toolbar{gap:10px}.comment-modes{flex:1;min-width:100%}.comment-modes button{flex:1;padding:8px 10px;white-space:nowrap}.comment-version-label{font-size:13px;margin-left:auto}.comment-toolbar select{min-height:40px;padding:6px 10px}.comment-actions{width:100%;justify-content:space-between}.comment-hint{font-size:14px}.comment-footer{gap:10px}.comment-image{border-radius:10px}.comment-note:not(.is-active) .comment-bubble{display:none}.comment-note.is-active .comment-bubble{left:0!important;top:calc(100% + 12px)!important;width:100%!important}.comment-mobile-number{display:grid;place-items:center;flex:0 0 26px;height:26px;margin:12px 0 0 10px;border-radius:50% 50% 50% 3px;background:var(--blue,#1c659f);color:white;font:700 14px/1 var(--body,Arial,sans-serif)}}
