#protection-view,.pr-dialog {
  --pr-accent:var(--rebrand-primary,var(--accent,#2454f0));
  --pr-soft:var(--rebrand-primary-soft,var(--accent-soft,#edf2ff));
  --pr-surface:var(--rebrand-surface,var(--surface,#fff));
  --pr-raised:var(--rebrand-surface-2,var(--surface-2,#f7f9ff));
  --pr-line:var(--rebrand-line,var(--line,rgba(22,23,27,.1)));
  --pr-line-strong:var(--rebrand-line-strong,var(--line-2,rgba(22,23,27,.2)));
  --pr-ink:var(--ink,#16171b);
  --pr-muted:var(--ink-2,#565963);
  color:var(--pr-ink);
  font-family:var(--sans,sans-serif);
}
#protection-view { width:100%;min-width:0;max-width:none;margin:0;gap:20px;box-sizing:border-box; }
#protection-view [hidden],.pr-dialog [hidden] { display:none!important; }
.pr-head,.pr-toolbar,.pr-tabs,.pr-subnav,.pr-actions { display:flex;align-items:center;gap:10px;flex-wrap:wrap; }
.pr-head { justify-content:space-between;gap:20px; }
.pr-head h2 { margin:0;font-size:24px;font-weight:600;line-height:1.3;letter-spacing:-.02em; }
.pr-note { margin:0;color:var(--pr-muted);font-size:13px;line-height:1.7; }
.pr-head .pr-note { margin-top:6px; }
.pr-coverage { display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border:1px solid var(--pr-line);border-radius:12px;background:var(--pr-surface); }
.pr-coverage>i { flex:none;font-size:18px;line-height:1.4;color:var(--pr-accent); }
.pr-tabs { flex-wrap:nowrap;gap:8px;margin:0;border-bottom:1px solid var(--pr-line);overflow-x:auto; }
.pr-tabs a { display:flex;align-items:center;gap:7px;flex:none;padding:12px 14px;border-bottom:2px solid transparent;color:var(--pr-muted);font-size:13.5px;font-weight:500;text-decoration:none;white-space:nowrap;transition:color .15s,border-color .15s; }
.pr-tabs a:hover { color:var(--pr-accent); }
.pr-tabs a[aria-current=page] { border-color:var(--pr-accent);color:var(--pr-accent); }
.pr-tabs i { font-size:17px; }
#pr-body,#pr-list { display:flex;flex-direction:column;gap:16px;min-width:0; }
.pr-toolbar { justify-content:space-between; }
.pr-subnav { padding:3px;gap:3px;border:1px solid var(--pr-line);border-radius:10px;background:var(--pr-surface); }
.pr-subnav button { min-height:32px;padding:7px 12px;border:0;border-radius:7px;background:transparent;color:var(--pr-muted);font:500 12.5px/1.2 var(--sans,sans-serif);cursor:pointer; }
.pr-subnav button[aria-pressed=true] { background:var(--pr-soft);color:var(--pr-accent); }
.pr-btn { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:8px 14px;border:1px solid var(--pr-line-strong);border-radius:10px;background:var(--pr-surface);color:var(--pr-ink);font:500 13px/1.3 var(--sans,sans-serif);white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s; }
.pr-btn:hover { background:var(--pr-raised);border-color:var(--pr-muted); }
.pr-btn.primary { border-color:transparent;background:var(--pr-accent);color:#fff;font-weight:600;box-shadow:0 1px 2px rgba(36,84,240,.2); }
.pr-btn.primary:hover { background:var(--rebrand-primary-hover,var(--accent-700,#1b3fc4)); }
.pr-btn:disabled { opacity:.45;cursor:not-allowed;box-shadow:none; }
.pr-btn.danger { color:var(--rebrand-danger,#d13b4f); }
.pr-btn:focus-visible,.pr-tabs a:focus-visible,.pr-subnav button:focus-visible,.pr-template:focus-visible { outline:2px solid var(--pr-accent);outline-offset:3px; }
.pr-field { display:grid;gap:7px;margin:0;color:var(--pr-muted);font-size:12.5px;font-weight:500; }
.pr-input { box-sizing:border-box;width:100%;min-width:0;min-height:40px;padding:9px 12px;border:1px solid var(--pr-line-strong);border-radius:8px;background:var(--pr-surface);color:var(--pr-ink);font:400 13px/1.5 var(--sans,sans-serif);transition:border-color .15s,box-shadow .15s; }
.pr-input::placeholder { color:var(--ink-3,#8c8f99); }
.pr-input:focus { outline:none;border-color:var(--pr-accent);box-shadow:0 0 0 3px var(--pr-soft); }
.pr-input:disabled { background:var(--pr-raised);color:var(--pr-muted); }
.pr-field textarea { resize:vertical;min-height:88px; }
.pr-scope { width:240px;max-width:100%; }
.pr-table-wrap { overflow-x:auto;border:1px solid var(--pr-line);border-radius:12px;background:var(--pr-surface);box-shadow:var(--glass-shadow); }
.pr-table { width:100%;border-collapse:collapse;font-size:13px; }
.pr-table th,.pr-table td { padding:14px 18px;text-align:left;border-bottom:1px solid var(--pr-line);vertical-align:middle; }
.pr-table th { border-top:0;background:var(--pr-raised);color:var(--pr-muted);font-size:11px;font-weight:600;white-space:nowrap; }
.pr-table tr:last-child td { border-bottom:0; }
.pr-table td { max-width:280px;overflow-wrap:anywhere; }
.pr-table tbody tr:hover { background:var(--pr-raised); }
.pr-table small { display:block;margin-top:5px;color:var(--pr-muted);font-size:11.5px;line-height:1.5; }
.pr-table .pr-btn { min-height:30px;padding:5px 10px;font-size:12px;border-radius:8px; }
.pr-tag { display:inline-flex;align-items:center;border:1px solid var(--pr-line);border-radius:100px;padding:3px 9px;background:var(--pr-raised);color:var(--pr-muted);font-size:11.5px;line-height:1.4; }
.pr-tag.block { color:#b42318;background:#fff1f0;border-color:#f7d0cc; }
.pr-tag.log_only { color:#067647;background:#ecfdf3;border-color:#c6ead8; }
.pr-empty { padding:48px 20px;text-align:center;border:1px solid var(--pr-line);border-radius:12px;background:var(--pr-surface);color:var(--pr-muted);font-size:13px;line-height:1.7; }
.pr-error { padding:12px 14px;border:1px solid #f7d0cc;border-radius:8px;background:#fff5f4;color:#b42318;font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere; }
.pr-message:empty { display:none; }
.pr-success { color:#067647;font-size:13px;line-height:1.6; }
.pr-templates { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px; }
.pr-template { position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px 14px;align-items:start;padding:20px;text-align:left;border:1px solid var(--pr-line);border-radius:12px;background:var(--pr-surface);color:var(--pr-ink);box-shadow:var(--glass-shadow);cursor:pointer;transition:border-color .15s,box-shadow .15s; }
.pr-template:hover { border-color:var(--pr-accent);box-shadow:var(--glass-shadow-lg); }
.pr-template>i { grid-row:1/4;display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:var(--pr-soft);color:var(--pr-accent);font-size:22px; }
.pr-template strong { padding-right:18px;font-size:15px;line-height:1.5;font-weight:600; }
.pr-template::after { content:'›';position:absolute;top:19px;right:18px;color:var(--ink-3,#8c8f99);font-size:22px;line-height:1; }
.pr-template .pr-note { font-size:12.5px; }
.pr-filter { display:flex;gap:12px;flex-wrap:wrap;padding:16px;border:1px solid var(--pr-line);border-radius:12px;background:var(--pr-surface); }
.pr-filter .pr-field { flex:1;min-width:140px; }
.pr-filter .pr-btn { align-self:end;min-height:40px; }
.pr-next { display:flex;justify-content:flex-end;margin-top:16px; }
body.pr-modal-open { overflow:hidden; }
.pr-dialog { position:fixed;inset:0;width:min(620px,calc(100vw - 48px));height:fit-content;max-height:calc(100dvh - 48px);margin:auto;padding:0;box-sizing:border-box;overflow:hidden;border:1px solid var(--pr-line);border-radius:18px;background:var(--pr-surface);box-shadow:0 20px 60px rgba(7,24,49,.28); }
.pr-dialog[open] { display:flex;flex-direction:column; }
.pr-dialog-wide { width:min(700px,calc(100vw - 48px)); }
.pr-dialog-templates { width:min(960px,calc(100vw - 48px)); }
.pr-dialog-templates .pr-toolbar { margin-bottom:14px; }
.pr-dialog-templates .pr-templates { margin-top:18px; }
.pr-dialog-compact { width:min(460px,calc(100vw - 48px)); }
.pr-dialog::backdrop { background:rgba(5,20,40,.42);backdrop-filter:blur(3px); }
.pr-dialog>.pr-head { flex:none;padding:20px 24px;border-bottom:1px solid var(--pr-line);gap:16px; }
.pr-dialog h2 { margin:0;font-size:18px;line-height:1.4; }
.pr-close { flex:none;width:34px;min-height:34px;padding:0;border:0;border-radius:8px;background:var(--pr-raised);color:var(--pr-muted);font-size:22px;font-weight:400; }
.pr-dialog-body { min-height:0;padding:20px 24px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable; }
.pr-dialog-body>p { margin:0 0 14px;font-size:14px;line-height:1.6;overflow-wrap:anywhere; }
.pr-dialog form { display:grid;gap:16px; }
.pr-rule-settings { display:grid;grid-template-columns:1fr 1fr;gap:16px;min-width:0; }
.pr-rule-settings>:nth-child(n+3) { grid-column:1/-1; }
.pr-dialog .pr-actions { justify-content:flex-end; }
.pr-dialog-footer { flex:none;padding:16px 24px;border-top:1px solid var(--pr-line);background:var(--pr-surface); }
.pr-dialog .pr-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.pr-sample .pr-grid { grid-template-columns:1fr 1fr; }
.pr-checks { max-height:150px;overflow:auto;padding:8px;border:1px solid var(--pr-line-strong);border-radius:8px;background:var(--pr-raised);font-size:13px; }
.pr-checks label { display:flex;align-items:flex-start;gap:10px;padding:7px 8px;overflow-wrap:anywhere;font-weight:400; }
.pr-dialog input[type=checkbox] { width:15px;height:15px;flex:none;margin-top:2px;accent-color:var(--pr-accent); }
.pr-sample { display:grid;gap:14px;border-top:1px solid var(--pr-line);margin-top:20px;padding-top:20px; }
.pr-dialog .pr-message:not(:empty),#pr-diff:not(:empty) { margin-top:16px; }
#pr-diff>.pr-actions { margin-top:16px; }
@media(max-width:640px) {
  #protection-view { gap:16px; }
  .pr-head { align-items:stretch;gap:16px; }
  .pr-head h2 { font-size:21px; }
  .pr-scope { width:100%; }
  .pr-coverage { padding:12px 14px;font-size:12px; }
  .pr-tabs { gap:0; }
  .pr-tabs a { padding:12px 9px;font-size:12.5px;gap:5px; }
  .pr-tabs i { font-size:15px; }
  .pr-templates { grid-template-columns:1fr;gap:12px; }
  .pr-template { padding:18px; }
  .pr-table { min-width:620px; }
  .pr-toolbar { gap:10px; }
  .pr-filter { padding:14px;gap:12px; }
  .pr-filter .pr-field { min-width:130px; }
  .pr-filter .pr-btn { width:100%; }
  .pr-dialog,.pr-dialog-wide,.pr-dialog-templates,.pr-dialog-compact { width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:14px; }
  .pr-dialog>.pr-head { padding:16px 18px;align-items:center; }
  .pr-dialog h2 { font-size:17px; }
  .pr-dialog-body { padding:18px; }
  .pr-dialog-footer { padding:14px 18px; }
  .pr-dialog .pr-grid,.pr-rule-settings { grid-template-columns:1fr; }
  .pr-dialog .pr-table { min-width:0; }
  .pr-dialog .pr-table th,.pr-dialog .pr-table td { padding:10px;font-size:11px; }
}
