.wsp-public { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial; }
.wsp-hero { background: linear-gradient(135deg, #061b3a, #06112a); color: #fff; padding: 22px; border-radius: 16px; display:flex; justify-content:space-between; gap:16px; align-items:center; margin: 14px 0; }
.wsp-hero h2 { margin:0; font-size: 28px; }
.wsp-hero p { margin: 6px 0 0; opacity:.85; }
.wsp-brand { font-weight: 800; letter-spacing:.2px; opacity:.9; }
.wsp-card { background: #081c3f; color:#eaf2ff; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; padding: 18px; box-shadow: 0 12px 30px rgba(0,0,0,.25); margin: 14px 0; }
.wsp-form { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items:end; }
.wsp-form-row { display:flex; flex-direction:column; gap:6px; }
.wsp-form-row input { padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.06); color:#fff; }
.wsp-btn { grid-column: 1 / -1; padding: 10px 14px; border-radius: 12px; border: none; cursor:pointer; font-weight: 800; background: linear-gradient(90deg, #2f7dff, #7c3aed); color:#fff; }
.wsp-alert { background: rgba(255, 80, 80, .15); border: 1px solid rgba(255, 80, 80, .35); padding: 10px 12px; border-radius: 12px; margin-bottom: 12px; }
.wsp-result-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; border-bottom: 1px solid rgba(255,255,255,.08); padding-bottom: 12px; margin-bottom: 14px; }
.wsp-muted { opacity:.8; font-size: 13px; }
.wsp-status { text-align:right; }
.wsp-badge { display:inline-block; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 900; }
.wsp-pending { background: rgba(238,242,255,.15); border: 1px solid rgba(238,242,255,.25); }
.wsp-approved { background: rgba(224,242,254,.15); border: 1px solid rgba(224,242,254,.25); }
.wsp-valid { background: rgba(220,252,231,.15); border: 1px solid rgba(220,252,231,.25); }
.wsp-rejected { background: rgba(254,226,226,.15); border: 1px solid rgba(254,226,226,.25); }
.wsp-expired { background: rgba(243,244,246,.12); border: 1px solid rgba(243,244,246,.20); }
.wsp-doc-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 900px){ .wsp-doc-grid{ grid-template-columns:1fr; } .wsp-form{ grid-template-columns:1fr; } }
.wsp-doc-card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 14px; }
.wsp-doc-title { font-weight: 900; margin-bottom: 8px; }
.wsp-doc-note { opacity:.75; }
.wsp-doc-link { display:inline-block; margin-bottom: 10px; color:#a5d8ff; text-decoration:none; font-weight:800; }
.wsp-embed-wrap { position:relative; border-radius: 14px; overflow:hidden; border:1px solid rgba(255,255,255,.08); }
.wsp-embed-wrap iframe { width:100%; height: 280px; border:0; background:#fff; }
.wsp-watermark { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size: 44px; font-weight: 1000; letter-spacing: 6px; opacity:.12; transform: rotate(-18deg); pointer-events:none; }
.wsp-footer { display:flex; justify-content:space-between; gap:12px; margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); font-size: 12px; opacity:.85; }