/* EalingPulse article discussion: compact footer preview + modal conversation. */
.epn-comments-card{margin-top:18px;padding:16px 17px;border:1px solid #d9e6eb;border-radius:19px;background:linear-gradient(135deg,#f8fbfc,#fff);box-shadow:0 8px 22px rgba(19,55,76,.045)}
.epn-comments-card__top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.epn-comments-card__title{display:flex;align-items:center;gap:11px;min-width:0}
.epn-comments-card__icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:14px;background:#e9f4ff;color:#176db2}
.epn-comments-card__icon svg{width:21px;height:21px}
.epn-comments-card__title>span{display:grid;gap:2px;min-width:0}
.epn-comments-card__title small{color:#0a8b82;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.epn-comments-card__title strong{color:#073b59;font-size:17px;line-height:1.2}
.epn-comments-card__open{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 14px;border:0;border-radius:13px;background:#0e6ea5;color:#fff;font:inherit;font-size:13px;font-weight:850;cursor:pointer;box-shadow:0 7px 16px rgba(14,110,165,.18)}
.epn-comments-card__open svg{width:16px;height:16px}
.epn-comments-preview{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;margin-top:13px;padding-top:13px;border-top:1px solid #e4ecef}
.epn-comments-preview__avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e8f4f2;color:#087a73;font-size:13px;font-weight:900;text-transform:uppercase}
.epn-comments-preview__copy{min-width:0}
.epn-comments-preview__meta{display:flex;align-items:center;gap:7px;min-width:0;color:#738792;font-size:11px}
.epn-comments-preview__meta strong{overflow:hidden;color:#31586d;text-overflow:ellipsis;white-space:nowrap}
.epn-comments-preview__copy p{display:-webkit-box;overflow:hidden;margin:3px 0 0;color:#526b79;font-family:var(--epn-font-editorial,Georgia,serif);font-size:13px;line-height:1.42;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.epn-comments-preview--empty{display:block;grid-column:1/-1;min-width:0;color:#6c818c;font-size:13px;line-height:1.48}

.epn-comments-modal[hidden]{display:none}
.epn-comments-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:18px}
.epn-comments-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(5,25,39,.64);backdrop-filter:blur(5px);cursor:pointer}
.epn-comments-dialog{position:relative;z-index:1;display:flex;flex-direction:column;width:min(720px,100%);max-height:min(82dvh,780px);overflow:hidden;border:1px solid rgba(255,255,255,.35);border-radius:24px;background:#fff;box-shadow:0 28px 80px rgba(3,24,39,.3)}
.epn-comments-dialog__head{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:15px;padding:17px 18px;border-bottom:1px solid #e4ebef;background:linear-gradient(135deg,#f5fbfd,#fff)}
.epn-comments-dialog__head>div{display:grid;gap:2px}
.epn-comments-dialog__head small{color:#0a8b82;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.epn-comments-dialog__head h2{margin:0;color:#073b59;font-size:20px;line-height:1.2}
.epn-comments-dialog__close{display:grid;place-items:center;width:40px;height:40px;border:1px solid #d8e4e9;border-radius:13px;background:#fff;color:#405f70;cursor:pointer}
.epn-comments-dialog__close svg{width:19px;height:19px}
.epn-comments-list{display:grid;flex:1 1 auto;gap:12px;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:17px 18px;background:#f6f9fb}
.epn-comment{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px}
.epn-comment__avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(145deg,#e2f3f0,#dceaff);color:#176b72;font-size:13px;font-weight:900;text-transform:uppercase}
.epn-comment__bubble{min-width:0;padding:11px 12px;border:1px solid #dce7ec;border-radius:5px 16px 16px 16px;background:#fff;box-shadow:0 5px 14px rgba(22,57,76,.04)}
.epn-comment__meta{display:flex;align-items:center;gap:8px;color:#80919a;font-size:11px}
.epn-comment__meta strong{color:#2b5267;font-size:12px}
.epn-comment__bubble p{margin:5px 0 0;color:#294a5e;font-size:14px;line-height:1.52;white-space:pre-wrap;overflow-wrap:anywhere}
.epn-comment__delete{margin:7px 0 0;padding:0;border:0;background:none;color:#a64c55;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
.epn-comments-empty{display:grid;place-items:center;min-height:160px;padding:20px;text-align:center;color:#6d818d}
.epn-comments-empty strong{display:block;margin-bottom:4px;color:#31596d;font-size:16px}
.epn-comments-loading{display:grid;place-items:center;min-height:150px;color:#66808e;font-size:13px}
.epn-comments-form{display:grid;flex:0 0 auto;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:14px 18px calc(14px + env(safe-area-inset-bottom));border-top:1px solid #e0e8ec;background:#fff}
.epn-comments-form textarea{width:100%;min-height:54px;max-height:140px;padding:12px 13px;border:1px solid #cbdbe3;border-radius:14px;background:#fff;color:#183c52;font:inherit;font-size:14px;line-height:1.45;resize:vertical}
.epn-comments-form textarea:focus{outline:3px solid rgba(14,139,130,.14);border-color:#49aaa3}
.epn-comments-form button{align-self:end;min-height:48px;padding:0 17px;border:0;border-radius:14px;background:#0a8b82;color:#fff;font:inherit;font-size:13px;font-weight:850;cursor:pointer}
.epn-comments-form button:disabled{opacity:.6;cursor:wait}
.epn-comments-status{grid-column:1/-1;min-height:17px;margin:0;color:#607a88;font-size:11px;font-weight:700}
.epn-comments-login{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px calc(15px + env(safe-area-inset-bottom));border-top:1px solid #e0e8ec;background:#fff;color:#546f7d;font-size:13px}
.epn-comments-login a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 14px;border-radius:13px;background:#0a8b82;color:#fff;font-weight:850;text-decoration:none;white-space:nowrap}
body.ep-comments-open{overflow:hidden}

@media(max-width:640px){
  .epn-comments-card{padding:14px;border-radius:17px}
  .epn-comments-card__top{align-items:flex-start}
  .epn-comments-card__title strong{font-size:16px}
  .epn-comments-card__open{min-height:40px;padding:0 11px;font-size:12px}
  .epn-comments-modal{
    top:var(--ep-comments-viewport-top,0px);
    right:auto;
    bottom:auto;
    left:var(--ep-comments-viewport-left,0px);
    width:var(--ep-comments-viewport-width,100%);
    height:var(--ep-comments-viewport-height,100dvh);
    align-items:end;
    padding:0;
    overflow:hidden;
  }
  .epn-comments-dialog{
    width:100%;
    height:min(88%,720px);
    max-height:calc(var(--ep-comments-viewport-height,100dvh) - 8px);
    border-radius:23px 23px 0 0;
  }
  .epn-comments-dialog__head{padding:13px 14px}
  .epn-comments-dialog__head h2{font-size:19px}
  .epn-comments-dialog__close{width:38px;height:38px}
  .epn-comments-list{padding:12px 14px 14px;scroll-padding-bottom:12px}
  .epn-comments-empty{min-height:90px;padding:16px 10px}
  .epn-comments-loading{min-height:90px}
  .epn-comments-form{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:8px;
    padding:9px 10px calc(9px + env(safe-area-inset-bottom));
  }
  .epn-comments-form textarea{
    min-height:48px;
    max-height:96px;
    padding:11px 12px;
    border-radius:13px;
    font-size:16px;
    resize:none;
  }
  .epn-comments-form button{width:auto;min-height:48px;padding:0 13px;white-space:nowrap}
  .epn-comments-status{margin-top:-2px}
  .epn-comments-login{align-items:stretch;flex-direction:column;padding:13px 14px calc(13px + env(safe-area-inset-bottom))}
  .epn-comments-login a{width:100%}
  .epn-comments-modal.is-keyboard-open .epn-comments-dialog{
    height:100%;
    max-height:100%;
    border-radius:18px 18px 0 0;
  }
  .epn-comments-modal.is-keyboard-open .epn-comments-dialog__head{padding:9px 12px}
  .epn-comments-modal.is-keyboard-open .epn-comments-dialog__head small{display:none}
  .epn-comments-modal.is-keyboard-open .epn-comments-dialog__head h2{font-size:17px}
  .epn-comments-modal.is-keyboard-open .epn-comments-dialog__close{width:34px;height:34px}
  .epn-comments-modal.is-keyboard-open .epn-comments-list{padding:9px 12px}
  .epn-comments-modal.is-keyboard-open .epn-comments-form{padding:7px 9px calc(7px + env(safe-area-inset-bottom))}
}
@media(max-width:640px) and (max-height:520px){
  .epn-comments-dialog{height:100%;max-height:100%;border-radius:16px 16px 0 0}
  .epn-comments-dialog__head{padding:8px 11px}
  .epn-comments-dialog__head small{display:none}
  .epn-comments-dialog__head h2{font-size:16px}
  .epn-comments-dialog__close{width:33px;height:33px}
  .epn-comments-list{padding:8px 11px}
  .epn-comments-form{padding:6px 8px calc(6px + env(safe-area-inset-bottom))}
}
