.wp-shell{display:grid;gap:16px}.wp-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:22px;border:1px solid #28618c;border-radius:20px;background:linear-gradient(135deg,#092942,#071725)}.wp-hero h2{margin:5px 0;font-size:30px}.wp-hero p{margin:0;color:#9fb8d2;max-width:720px;line-height:1.5}.wp-live{display:inline-flex;gap:7px;align-items:center;border:1px solid #1bbd8b66;border-radius:999px;padding:8px 11px;color:#74e4be;font-size:12px;font-weight:900;white-space:nowrap}.wp-live i{width:8px;height:8px;border-radius:50%;background:#20d59c;box-shadow:0 0 0 4px #20d59c20}.wp-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.wp-metric{border:1px solid #274661;border-radius:15px;background:#0b1b2b;padding:14px}.wp-metric small{display:block;color:#8ca7c0;font-size:10px;font-weight:800;letter-spacing:.08em}.wp-metric b{display:block;margin-top:5px;font-size:27px}.wp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.wp-card{border:1px solid #294a65;border-radius:17px;background:#081827;padding:16px}.wp-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.wp-card h3{margin:0;font-size:17px}.wp-card p{margin:7px 0 0;color:#9cb5cc;font-size:13px;line-height:1.45}.wp-utility{display:inline-flex;align-items:center;gap:7px;color:#b9cde1;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.wp-utility i{width:9px;height:9px;border-radius:50%;background:var(--wp-color)}.wp-status{display:inline-flex;border:1px solid #45607a;border-radius:999px;padding:5px 8px;color:#bbcee0;background:#102338;font-size:10px;font-weight:900;text-transform:uppercase}.wp-status.active{border-color:#1ecb9366;background:#1ecb9314;color:#75e9bc}.wp-status.paused,.wp-status.required{border-color:#ffc54866;background:#ffc54812;color:#ffdc87}.wp-status.scheduled{border-color:#5aa8ff66;background:#5aa8ff12;color:#9cc9ff}.wp-status.completed{border-color:#20c98966;color:#75e8b9}.wp-status.cancelled{border-color:#ff777766;color:#ffafaf}.wp-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:13px}.wp-fact{padding:9px;border:1px solid #203c55;border-radius:11px;background:#0b1d2f}.wp-fact small{display:block;color:#8faac4;font-size:10px}.wp-fact b{display:block;margin-top:3px;font-size:12px}.wp-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.wp-actions button{width:auto}.wp-observe{margin-top:13px;padding-top:13px;border-top:1px solid #203a52}.wp-observe textarea,.wp-form textarea,.wp-form input,.wp-form select{box-sizing:border-box;width:100%;border:1px solid #3a5872;border-radius:10px;background:#0c2032;color:#f4f8fc;padding:10px}.wp-observe textarea{resize:vertical}.wp-observe-foot{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}.wp-observe-foot select{width:auto;min-width:150px}.wp-event-list{display:grid;gap:7px;margin-top:13px}.wp-event{display:grid;gap:2px;padding-left:11px;border-left:2px solid #397db5}.wp-event b{font-size:12px}.wp-event small{color:#8ea7c0;font-size:10px}.wp-empty{border:1px dashed #39546c;border-radius:15px;padding:18px;color:#9bb3ca;display:grid;gap:5px;grid-column:1/-1}.wp-empty b{color:#edf5fc}.wp-modal{width:min(800px,calc(100vw - 28px);max-height:90vh;overflow:auto}.wp-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.wp-form label{display:grid;gap:6px;color:#b9cde0;font-size:12px;font-weight:800}.wp-form .wp-wide{grid-column:1/-1}.wp-form-message{min-height:18px;color:#ffb0b0;font-size:12px}.wp-timer{font-variant-numeric:tabular-nums;letter-spacing:.04em}@media(max-width:800px){.wp-grid{grid-template-columns:1fr}.wp-metrics{grid-template-columns:1fr 1fr}.wp-form-grid{grid-template-columns:1fr}.wp-form .wp-wide{grid-column:auto}}@media(max-width:520px){.wp-hero{display:grid}.wp-metrics{grid-template-columns:1fr 1fr}.wp-facts{grid-template-columns:1fr}.wp-observe-foot{display:grid}.wp-observe-foot select,.wp-observe-foot button{width:100%}}
/* Scroll the Watch & Protect form inside the dialog so every field and the
   save control stay reachable on laptop, tablet, and phone viewports. */
.modal:has(.wp-modal){display:block;overflow-y:auto;overscroll-behavior:contain;padding:22px;box-sizing:border-box}
.modal:has(.wp-modal) .wp-modal{width:min(800px,100%);max-height:calc(100vh - 44px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;margin:0 auto;padding-bottom:22px}
.modal:has(.wp-modal) .wp-modal #wpSave{position:sticky;bottom:0;width:100%;margin-top:16px;box-shadow:0 -16px 20px #081829}
@media(max-width:520px){.modal:has(.wp-modal){padding:10px}.modal:has(.wp-modal) .wp-modal{max-height:calc(100vh - 20px)}}
