/* News PhotoCard Pro — front end */
.npcp-wrap{display:flex;margin:24px 0}
.npcp-wrap--center{justify-content:center}
.npcp-wrap--left{justify-content:flex-start}
.npcp-wrap--right{justify-content:flex-end}

.npcp-trigger{--npcp-accent:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font:600 15px/1.4 inherit;padding:.72em 1.35em;border-radius:8px;border:1.5px solid var(--npcp-accent);
  background:var(--npcp-accent);color:#fff;cursor:pointer;text-decoration:none;
  transition:filter .18s ease,transform .18s ease,box-shadow .18s ease;box-shadow:0 1px 2px rgba(15,23,42,.12)}
.npcp-trigger:hover{filter:brightness(.92)}
.npcp-trigger:active{transform:translateY(1px)}
.npcp-trigger:focus-visible{outline:3px solid var(--npcp-accent);outline-offset:3px}
.npcp-trigger[disabled]{opacity:.6;cursor:progress}
.npcp-trigger.is-busy .npcp-trigger__icon{animation:npcp-spin 1s linear infinite}
.npcp-trigger--outline{background:transparent;color:var(--npcp-accent)}
.npcp-trigger--outline:hover{background:var(--npcp-accent);color:#fff}
.npcp-trigger--pill{border-radius:999px;padding:.72em 1.6em}
.npcp-trigger--minimal{background:none;border-color:transparent;color:var(--npcp-accent);box-shadow:none;padding:.4em .2em}
.npcp-trigger--minimal:hover{text-decoration:underline;filter:none}
@keyframes npcp-spin{to{transform:rotate(360deg)}}

body.npcp-modal-open{overflow:hidden}
.npcp-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px}
.npcp-modal__backdrop{position:absolute;inset:0;background:rgba(9,12,20,.78);backdrop-filter:blur(3px)}
.npcp-modal__panel{position:relative;z-index:1;width:min(920px,100%);max-height:94vh;overflow:auto;
  background:#fff;color:#111827;border-radius:16px;padding:26px;
  box-shadow:0 24px 70px rgba(2,6,23,.45);animation:npcp-rise .22s ease}
@keyframes npcp-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.npcp-modal__panel{animation:none}.npcp-trigger{transition:none}}
.npcp-modal__panel.is-busy{cursor:progress}

.npcp-modal__close{position:absolute;top:12px;right:12px;width:36px;height:36px;display:grid;place-items:center;
  border:0;border-radius:50%;background:#f1f5f9;color:#334155;cursor:pointer}
.npcp-modal__close:hover{background:#e2e8f0}

.npcp-modal__stage{display:flex;flex-direction:column;align-items:center;gap:10px;min-height:220px}
.npcp-modal__figure{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:200px}
.npcp-modal__figure img{max-width:100%;max-height:52vh;width:auto;height:auto;border-radius:10px;
  box-shadow:0 10px 30px rgba(2,6,23,.22);background:#f8fafc}
.npcp-modal__figure.is-loading::after{content:"";position:absolute;inset:0;margin:auto;width:44px;height:44px;
  border:3px solid #e2e8f0;border-top-color:#1d4ed8;border-radius:50%;animation:npcp-spin 1s linear infinite}
.npcp-modal__meta{margin:0;font-size:12px;color:#64748b;letter-spacing:.02em}
.npcp-modal__status{display:none;font-size:13px;color:#475569;text-align:center}
.npcp-modal__status.is-visible{display:block}
.npcp-modal__status.is-error{color:#b91c1c;font-weight:600}

.npcp-modal__controls{display:flex;flex-wrap:wrap;gap:18px;margin:20px 0 4px;padding-top:18px;border-top:1px solid #e2e8f0}
.npcp-field{display:flex;flex-direction:column;gap:6px;flex:1 1 220px;min-width:0}
.npcp-field__label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#64748b}
.npcp-field__control{width:100%;padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;font-size:14px;color:inherit;background:#fff}
.npcp-field__help{font-size:12px;color:#64748b}
.npcp-headline{resize:vertical;min-height:52px}

.npcp-sizes{display:flex;flex-wrap:wrap;gap:8px}
.npcp-size{display:flex;align-items:center;gap:8px;padding:7px 12px;border:1.5px solid #cbd5e1;background:#fff;
  border-radius:9px;cursor:pointer;font:inherit;font-size:13px;color:#334155}
.npcp-size:hover{border-color:#94a3b8}
.npcp-size.is-active{border-color:#1d4ed8;background:#eff6ff;color:#1d4ed8;font-weight:600}
.npcp-size__ratio{display:block;width:16px;background:currentColor;opacity:.5;border-radius:2px}

.npcp-modal__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.npcp-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:9px;border:1.5px solid #cbd5e1;
  background:#fff;color:#1f2937;font:600 15px/1 inherit;cursor:pointer;transition:background .16s ease,border-color .16s ease}
.npcp-btn:hover{background:#f8fafc;border-color:#94a3b8}
.npcp-btn:focus-visible{outline:3px solid #1d4ed8;outline-offset:2px}
.npcp-btn[disabled]{opacity:.55;cursor:not-allowed}
.npcp-btn--primary{background:#1d4ed8;border-color:#1d4ed8;color:#fff}
.npcp-btn--primary:hover{background:#1e40af;border-color:#1e40af}
.npcp-btn--ghost{margin-left:auto;border-style:dashed}
.npcp-linkbtn{background:none;border:0;color:#1d4ed8;cursor:pointer;font:inherit;font-size:13px;padding:0;text-decoration:underline}

@media (max-width:640px){
  .npcp-modal{padding:0;align-items:flex-end}
  .npcp-modal__panel{width:100%;max-height:96vh;border-radius:16px 16px 0 0;padding:20px 16px 24px}
  .npcp-modal__figure img{max-height:44vh}
  .npcp-modal__actions .npcp-btn{flex:1 1 auto;justify-content:center}
  .npcp-btn--ghost{margin-left:0;flex-basis:100%}
}
@media (prefers-color-scheme:dark){
  .npcp-modal__panel{background:#0f172a;color:#e2e8f0}
  .npcp-modal__close{background:#1e293b;color:#cbd5e1}
  .npcp-modal__controls{border-top-color:#1e293b}
  .npcp-field__control,.npcp-size,.npcp-btn{background:#111827;border-color:#334155;color:#e2e8f0}
  .npcp-size.is-active{background:#1e3a8a;border-color:#3b82f6;color:#dbeafe}
}
