web-loodsman-remarks-frame, .wa-native-remarks-host { display:block; width:100%; height:100%; min-width:0; min-height:0; overflow:hidden; background:#fff; font-family:Roboto,Arial,sans-serif; }
.wa-native-remarks { height:100%; min-height:0; display:flex; flex-direction:column; color:#262626; background:#fff; }
.wa-native-remarks-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px 10px; border-bottom:1px solid #e5e5e5; background:#fafafa; }
.wa-native-remarks-title { font-size:16px; font-weight:600; line-height:1.25; }
.wa-native-remarks-subtitle { margin-top:3px; max-width:62vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; color:#707070; }
.wa-native-remarks-actions { display:flex; gap:8px; flex:0 0 auto; }
.wa-native-remarks-btn { min-height:32px; border:1px solid #cfcfcf; border-radius:4px; padding:0 11px; background:#fff; color:#272727; font:inherit; cursor:pointer; }
.wa-native-remarks-btn:hover:not(:disabled) { background:#f2f7fb; border-color:#8eb7d7; }
.wa-native-remarks-btn.primary { background:#168ddd; border-color:#168ddd; color:#fff; }
.wa-native-remarks-btn.primary:hover:not(:disabled) { background:#087bc7; }
.wa-native-remarks-btn.icon { width:34px; padding:0; font-size:18px; }
.wa-native-remarks-btn:disabled { opacity:.45; cursor:default; }
.wa-native-remarks-toolbar { display:grid; grid-template-columns:minmax(180px,1fr) minmax(150px,220px); gap:8px; padding:10px 14px; border-bottom:1px solid #ededed; }
.wa-native-remarks-search,.wa-native-remarks-filter { box-sizing:border-box; height:34px; min-width:0; border:1px solid #cfcfcf; border-radius:4px; padding:0 9px; background:#fff; color:#222; font:inherit; }
.wa-native-remarks-info { min-height:18px; padding:7px 14px 5px; color:#737373; font-size:12px; }
.wa-native-remarks-list { flex:1 1 auto; min-height:0; overflow:auto; padding:4px 12px 14px; }
.wa-native-remarks-empty,.wa-native-remarks-error { margin:12px 2px; padding:16px; border-radius:5px; background:#f6f6f6; color:#707070; text-align:center; }
.wa-native-remarks-error { background:#fff0f0; color:#a22424; text-align:left; }
.wa-native-remark-card { margin:8px 0; padding:10px 12px; border:1px solid #dedede; border-radius:5px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.wa-native-remark-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.wa-native-remark-number { font-size:13px; }
.wa-native-remark-state { padding:3px 7px; border-radius:10px; background:#ececec; color:#555; font-size:11px; white-space:nowrap; }
.wa-native-remark-state.state-1 { background:#fff0d2; color:#875a00; }.wa-native-remark-state.state-2 { background:#e3f5e7; color:#216a31; }.wa-native-remark-state.state-3 { background:#fde6e6; color:#922e2e; }
.wa-native-remark-meta { margin-top:6px; font-size:11px; color:#818181; }
.wa-native-remark-text { margin-top:7px; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.38; font-size:13px; }
.wa-native-remark-extra { margin-top:7px; color:#6c6c6c; font-size:11px; }
.wa-native-remark-open { margin-top:8px; border:0; padding:0; background:none; color:#087bc7; cursor:pointer; font:inherit; font-size:12px; text-decoration:underline; }
.wa-native-remarks-dialog-shade { position:fixed; inset:0; z-index:2147483500; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(0,0,0,.42); }
.wa-native-remarks-dialog { width:min(620px,90vw); border-radius:8px; background:#fff; box-shadow:0 18px 60px rgba(0,0,0,.28); padding:16px; }
.wa-native-remarks-dialog-title { margin-bottom:12px; font-size:18px; font-weight:600; }.wa-native-remarks-dialog-text { box-sizing:border-box; width:100%; min-height:150px; resize:vertical; border:1px solid #c9c9c9; border-radius:5px; padding:10px; font:inherit; }.wa-native-remarks-dialog-message { min-height:20px; margin-top:7px; color:#a22424; font-size:12px; }.wa-native-remarks-dialog-buttons { display:flex; justify-content:flex-end; gap:8px; margin-top:10px; }
/* Пока штатный RemarksFrameComponent присутствует в активной компоновке, старый DOM-вставленный таб не показываем. */
html.wa-native-remarks-frame-present [data-wa-remarks-tab], html.wa-native-remarks-frame-present .wa-remarks-panel { display:none !important; }
@media (max-width:760px){.wa-native-remarks-toolbar{grid-template-columns:1fr}.wa-native-remarks-subtitle{max-width:45vw}.wa-native-remarks-btn.primary{font-size:12px}}