/* Always pair hazard color with a named hazard and a distinct pictogram. */
#main [data-level="fatal"] { --hazard-ink:#ac222e;--hazard-bg:#fff0f1;--hazard-line:#eeb9be; }
#main [data-level="danger"] { --hazard-ink:#a3440c;--hazard-bg:#fff3e8;--hazard-line:#edc39e; }
#main [data-level="warning"] { --hazard-ink:#7d6108;--hazard-bg:#fff9df;--hazard-line:#e5d28a; }
html[data-theme="dark"] #main [data-level="fatal"] { --hazard-ink:#ffacb4;--hazard-bg:#44242b;--hazard-line:#81434e; }
html[data-theme="dark"] #main [data-level="danger"] { --hazard-ink:#ffc08f;--hazard-bg:#402e24;--hazard-line:#80543a; }
html[data-theme="dark"] #main [data-level="warning"] { --hazard-ink:#f1d78e;--hazard-bg:#393323;--hazard-line:#726235; }
#main .sm-hazard-badge { display:inline-flex;align-items:center;vertical-align:middle;max-width:100%;min-height:24px;margin:2px 0 2px 8px;padding:1px 6px 1px 3px;gap:4px;border:1px solid var(--hazard-line);border-radius:5px!important;background:var(--hazard-bg);color:var(--hazard-ink);font:600 11px/1.45 var(--reader-font);cursor:pointer;text-indent:0;white-space:normal;text-align:left; }
#main .sm-hazard-badge:hover { border-color:var(--hazard-ink); }
#main .sm-hazard-badge:focus-visible,#main .sm-hazard-close:focus-visible { outline:2px solid var(--reader-accent);outline-offset:3px; }
#main .sm-hazard-icon { width:20px;height:20px;flex:none;object-fit:contain;filter:none!important;opacity:1!important; }
#main .sm-recipe-output td:first-child .sm-hazard-badge { margin-left:0;display:flex;width:fit-content; }
#main .sm-hazard-dialog { position:fixed;inset:0;width:min(580px,calc(100vw - 28px));max-height:calc(100dvh - 40px);margin:auto;padding:20px;border:1px solid var(--mr-rule);border-radius:12px!important;box-shadow:0 20px 80px #101c3e40;background:var(--mr-page);color:var(--mr-ink);overflow:auto;font:13px/1.65 var(--reader-font); }
#main .sm-hazard-dialog::backdrop { background:#111e3d66;backdrop-filter:blur(3px); }
#main .sm-hazard-dialog>header { display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:8px; }
#main .sm-hazard-dialog h2 { margin:0;font:700 17px/1.5 var(--reader-font);color:var(--mr-ink); }
#main .sm-hazard-close { display:grid;place-items:center;width:32px;height:32px;min-width:32px;padding:0;line-height:1;box-sizing:border-box;flex:none;border:1px solid var(--mr-rule);background:var(--mr-wash);color:var(--mr-muted);font-size:22px;cursor:pointer; }
#main .sm-hazard-dialog p { margin:6px 0;text-indent:0;font:inherit;color:inherit; }
#main .sm-hazard-dialog .sm-hazard-scope { color:var(--mr-muted);margin-bottom:15px;font-size:12px; }
#main .sm-hazard-record { padding:12px 14px;margin-top:10px;background:var(--hazard-bg);border:1px solid var(--hazard-line);border-left:3px solid var(--hazard-ink);border-radius:7px!important; }
#main .sm-hazard-record h3 { display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 6px;color:var(--hazard-ink);font:650 14px/1.5 var(--reader-font); }
#main .sm-hazard-record h3 small { font-size:11px; }
#main .sm-hazard-record .sm-hazard-icon { width:27px;height:27px; }
#main .sm-hazard-dialog .sm-hazard-product { font-size:11px;color:var(--mr-muted); }
#main .sm-hazard-dialog a { color:var(--reader-accent);font-size:12px;text-decoration:underline;text-underline-offset:3px; }
#main .sm-hazard-legend { margin-top:16px;border-top:1px solid var(--mr-rule);padding-top:12px;font-size:12px;color:var(--mr-muted); }
#main .sm-hazard-legend summary { cursor:pointer; }
@media(max-width:700px) { #main .sm-hazard-dialog { padding:15px; } #main .sm-hazard-badge { font-size:10px;margin-left:5px; } }

#main .sm-close-icon { display:block;width:18px;height:18px;flex:none;pointer-events:none; }
