/* ============================================================
   SAFENTRA — RISK MANAGEMENT STYLES (SIM 03)
   Hazard library & register, risk matrix, heat map, control
   hierarchy, review queue, executive & reports surfaces.
   Built on tokens.css / components.css / org.css.
   ============================================================ */

/* ---------- stat tone extensions ---------- */
.os-ic.rd{background:var(--red-50);color:var(--red-600)}
.os-ic.gr{background:var(--gray-100,#EEF2F7);color:var(--gray-600,#475569)}

/* ---------- risk level chip ---------- */
.rk-lvl{display:inline-flex;align-items:center;gap:6px;padding:2px 10px 2px 8px;border-radius:var(--r-full);
  background:var(--lb,var(--gray-100,#F1F5F9));color:var(--lc,var(--gray-600,#475569));
  font-size:var(--text-xs);font-weight:700;white-space:nowrap;flex:none}
.rk-lvl.sm{font-size:10px;padding:1px 8px;font-weight:800}
.rk-dot{width:7px;height:7px;border-radius:50%;background:var(--lc,var(--gray-500,#94A3B8));flex:none;display:inline-block}
.rk-catdot{display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:9px;
  background:color-mix(in srgb, var(--cc, #64748B) 14%, transparent);color:var(--cc,#64748B)}
.rk-rv{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--color-text-3);white-space:nowrap;flex:none}
.rk-rv.soon{color:var(--amber-600);font-weight:700}
.rk-rv.overdue{color:var(--red-600);font-weight:700}

/* ---------- generic row link ---------- */
.rk-row{display:flex;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--color-border);
  border-radius:10px;text-decoration:none;color:inherit;background:var(--color-surface);transition:border-color .12s,box-shadow .12s}
.rk-row:hover{border-color:var(--blue-300);box-shadow:var(--shadow-sm);text-decoration:none}
.rk-row .flex-1>span{display:block;font-size:11px;color:var(--color-text-3)}
.rk-row[role="button"]{cursor:pointer}
.rk-linkrow{cursor:pointer}
.rk-linkrow:hover{background:var(--blue-25,#F4F8FF)}

/* ---------- ref/people atoms ---------- */
.rk-ref-ic{width:30px;height:30px;flex:none;border-radius:8px;background:var(--blue-50);color:var(--color-primary);display:inline-flex;align-items:center;justify-content:center}
.rk-note{display:flex;gap:8px;align-items:flex-start;font-size:12px;background:var(--blue-25,#F4F8FF);
  border:1px solid var(--blue-100);border-radius:10px;padding:10px;color:var(--color-text-2);line-height:1.5}
.rk-note svg{flex:none;margin-top:1px}
.rk-ul{margin:8px 0 0;padding-left:18px;font-size:12px;color:var(--color-text-2);display:flex;flex-direction:column;gap:4px}
.rk-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:11px;color:var(--color-text-3)}
.rk-legend span{display:inline-flex;align-items:center;gap:6px}
.rk-legend i{width:12px;height:12px;border-radius:4px;background:var(--sw,var(--blue-100));display:inline-block}

/* ---------- svg widgets ---------- */
.rk-trend{width:100%;height:auto;display:block}
.rk-svg-lb{font-size:9px;fill:var(--color-text-3)}
.rk-donut-v{font-size:26px;font-weight:800;fill:var(--color-text)}
.rk-donut-l{font-size:8.5px;letter-spacing:.14em;fill:var(--color-text-3)}

/* ---------- hazard cards ---------- */
.rk-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.hz-card{border:1px solid var(--color-border);border-radius:var(--r-lg);padding:14px;background:var(--color-surface);
  cursor:pointer;transition:border-color .12s,box-shadow .12s,transform .12s;display:flex;flex-direction:column}
.hz-card:hover{border-color:var(--blue-300);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.hz-card:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.hz-card-h{display:flex;gap:10px;align-items:flex-start}
.hz-card-t{display:block;font-size:var(--text-sm);line-height:1.35}
.hz-card-c{display:block;font-size:11px;margin-top:2px}
.hz-card-d{font-size:12px;color:var(--color-text-2);margin:10px 0;min-height:34px;line-height:1.5}
.hz-card-f{display:flex;gap:10px;align-items:center;justify-content:space-between;border-top:1px dashed var(--color-border);
  padding-top:10px;font-size:11px;flex-wrap:wrap;margin-top:auto}
.hz-card-f>span{display:inline-flex;align-items:center;gap:5px}

/* ---------- chip bar (library categories) ---------- */
.rk-chipbar{display:flex;gap:6px;flex-wrap:wrap}
.rk-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 9px;border-radius:var(--r-full);
  border:1px solid var(--color-border);background:var(--color-surface);font-size:12px;font-weight:600;color:var(--color-text-2);
  cursor:pointer;transition:all .12s;text-decoration:none}
.rk-chip svg{color:var(--cc,var(--color-text-3))}
.rk-chip .tnum{font-size:10px;color:var(--color-text-3);background:var(--color-bg);padding:1px 6px;border-radius:var(--r-full)}
.rk-chip:hover{border-color:var(--blue-300)}
.rk-chip.on{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.rk-chip.on svg{color:#fff}
.rk-chip.on .tnum{background:rgba(255,255,255,.18);color:#fff}

/* ---------- filter bar ---------- */
.rk-fb{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.rk-fb .ctl{flex:1 1 140px;min-width:126px;max-width:215px}
.rk-fb input.ctl{max-width:180px}
.rk-fb .btn{flex:none;white-space:nowrap}

/* ---------- category cards ---------- */
.rk-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.cat-card{position:relative;border:1px solid var(--color-border);border-radius:var(--r-lg);padding:16px 16px 14px 18px;
  background:var(--color-surface);cursor:pointer;transition:border-color .12s,box-shadow .12s;overflow:hidden}
.cat-card:hover{border-color:var(--blue-300);box-shadow:var(--shadow-md)}
.cat-strip{position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--cc)}
.cat-top{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.cat-ic{width:40px;height:40px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb, var(--cc) 14%, transparent);color:var(--cc)}
.cat-ic.lg{width:56px;height:56px;border-radius:14px}
.cat-card h4{margin:0 0 2px;font-size:var(--text-md)}
.cat-desc{font-size:12px;color:var(--color-text-2);min-height:50px;margin:8px 0 0;line-height:1.5}
.cat-meta{display:flex;gap:14px;font-size:12px;color:var(--color-text-2);margin:12px 0}
.cat-foot{display:flex;gap:8px}
.cat-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:210px;
  border:1.5px dashed var(--color-border-strong,var(--color-border));border-radius:var(--r-lg);background:transparent;
  color:var(--color-text-3);cursor:pointer;font-size:12px;transition:all .12s}
.cat-add svg{width:26px;height:26px}
.cat-add b{font-size:var(--text-sm);color:var(--color-text-2)}
.cat-add:hover{border-color:var(--color-primary);color:var(--color-primary)}
.cat-add:hover b{color:var(--color-primary)}

/* ============================================================
   RISK MATRIX
   ============================================================ */
.rmx{display:grid;grid-template-columns:26px repeat(5,minmax(0,1fr)) 24px;
  grid-template-rows:repeat(5,minmax(54px,1fr)) 18px 16px;gap:5px}
.rmx-yt{grid-column:1;grid-row:1/span 5;writing-mode:vertical-rl;transform:rotate(180deg);
  display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.14em;color:var(--color-text-3);font-weight:800}
.rmx-y{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:var(--color-text-3)}
.rmx-corner{grid-column:1}
.rmx-x{grid-column:2/span 5;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.14em;color:var(--color-text-3);font-weight:800}
.rmx-xs{display:flex;align-items:flex-start;justify-content:center;font-size:11px;font-weight:800;color:var(--color-text-3)}
.rmx-cell{border:0;border-radius:10px;background:var(--lb,var(--gray-100));display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;padding:6px 4px;cursor:pointer;transition:transform .12s,box-shadow .12s;font-family:inherit}
.rmx-cell:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
.rmx-cell:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
.rmx-lv{font-size:9.5px;font-weight:800;color:var(--lc);letter-spacing:.05em}
.rmx-n{font-size:13px;font-weight:800;color:var(--color-text)}
.rmx-mini{grid-template-rows:repeat(5,minmax(26px,1fr)) 14px 12px;gap:3px}
.rmx-mini .rmx-cell{border-radius:6px;padding:2px;cursor:default}
.rmx-mini .rmx-cell:hover{transform:none;box-shadow:none}
.rmx-mini .rmx-n{font-size:9px;font-weight:800;color:var(--lc);line-height:1.2}
.rmx-mini .rmx-y,.rmx-mini .rmx-xs{font-size:9px}
.rmx-peek{grid-template-columns:repeat(5,22px);grid-template-rows:repeat(5,22px);gap:3px;display:inline-grid}
.rmx-peek .rmx-cell{border-radius:5px;cursor:default;padding:0;font-size:8px}
.rmx-peek .rmx-cell:hover{transform:none;box-shadow:none}
.rmx-peek .rmx-cell.mine{box-shadow:0 0 0 2.5px var(--lc);font-weight:800;color:var(--lc)}
.rmx-edt{border:1.5px dashed transparent}
.rmx-edt:hover{border-color:var(--lc)}
.rmx-cfg .rmx-cell{cursor:crosshair}

/* ---------- heat map ---------- */
.heat{display:grid;grid-template-columns:26px repeat(5,minmax(0,1fr)) 24px;
  grid-template-rows:repeat(5,minmax(84px,1fr)) 20px 18px;gap:6px}
.heat .rmx-yt{grid-column:1;grid-row:1/span 5}
.heat-cell{position:relative;border:0;border-radius:12px;background:var(--color-bg);overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;cursor:pointer;font-family:inherit;transition:transform .12s,box-shadow .12s}
.heat-cell::before{content:'';position:absolute;inset:0;background:var(--lc);opacity:calc(var(--ld) * .72);border-radius:12px}
.heat-cell:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}
.heat-cell:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
.heat-n{position:relative;font-size:22px;font-weight:800;color:var(--color-text);line-height:1.05}
.heat-p{position:relative;font-size:10.5px;font-weight:700;color:var(--color-text-2)}

/* ---------- estimator / axis pickers ---------- */
.rk-sel-l{font-size:11px;font-weight:800;color:var(--color-text-3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px}
.rk-axis{display:flex;gap:6px}
.axis-pick{flex:1;min-width:0;border:1.5px solid var(--color-border);border-radius:10px;background:var(--color-surface);
  padding:8px 4px;text-align:center;cursor:pointer;display:flex;flex-direction:column;gap:1px;font-family:inherit;transition:all .12s}
.axis-pick b{font-size:13px;color:var(--lc)}
.axis-pick span{font-size:11px;font-weight:600;color:var(--color-text)}
.axis-pick small{font-size:9.5px;color:var(--color-text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.axis-pick:hover{border-color:var(--lc)}
.axis-pick.on{border-color:var(--lc);background:color-mix(in srgb, var(--lc) 6%, transparent);box-shadow:0 0 0 1px var(--lc)}
.rk-res{display:flex;gap:14px;align-items:center;border-radius:14px;background:var(--lb);padding:14px}
.rk-res-v{display:flex;flex-direction:column;align-items:center;border-right:2px solid color-mix(in srgb, var(--lc) 22%, transparent);padding-right:14px}
.rk-res-v span{font-size:11px;color:var(--lc);font-weight:800}
.rk-res-v b{font-size:34px;font-weight:800;color:var(--lc);line-height:1.05}
.rk-res-t{min-width:0}
.rk-res-t p{font-size:12px;margin:6px 0 4px;color:var(--color-text)}

/* ---------- likelihood / severity scale cards ---------- */
.rk-scale{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-3)}
.rk-sc-card{border:1px solid var(--color-border);border-top:4px solid var(--cc);border-radius:var(--r-lg);
  padding:14px;background:var(--color-surface)}
.rk-sc-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.rk-sc-v{width:34px;height:34px;flex:none;border-radius:10px;background:var(--cc);color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.rk-sc-card>p{font-size:12px;color:var(--color-text-2);min-height:60px;line-height:1.5;margin:0 0 8px}
.rk-sc-ex{margin-top:10px;border-top:1px dashed var(--color-border);padding-top:8px}
.rk-sc-ex b{font-size:10px;color:var(--color-text-3);text-transform:uppercase;letter-spacing:.07em}

/* ---------- config ---------- */
.rk-preset{display:flex;flex-direction:column;gap:3px;text-align:left;border:1px solid var(--color-border);
  background:var(--color-surface);border-radius:10px;padding:10px 12px;cursor:pointer;width:100%;font-family:inherit;transition:border-color .12s}
.rk-preset:hover{border-color:var(--color-primary)}

/* ---------- criteria ---------- */
.rk-rules{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.rk-rules li{display:flex;gap:10px;font-size:var(--text-sm);align-items:flex-start;line-height:1.5}
.rk-rule-n{flex:none;width:24px;height:24px;border-radius:8px;background:var(--amber-50);color:var(--amber-600);
  font-weight:800;font-size:11px;display:flex;align-items:center;justify-content:center}

/* ---------- controls ---------- */
.rk-pyr{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.pyr-tier{width:var(--pyw,100%);margin:0 auto;display:flex;gap:10px;align-items:center;padding:10px 14px;border-radius:10px;
  background:color-mix(in srgb, var(--cc) 10%, transparent);border:1.5px solid color-mix(in srgb, var(--cc) 26%, transparent)}
.pyr-n{flex:none;width:22px;height:22px;border-radius:7px;background:var(--cc);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800}
.pyr-tier b{font-size:13px;color:var(--color-text)}
.pyr-e{margin-left:auto;font-size:11px;font-weight:800;color:var(--cc)}
.rk-tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-3)}
.rk-tier{background:var(--color-surface);border:1px solid var(--color-border);border-top:3px solid var(--cc);border-radius:var(--r-lg);padding:14px}
.rk-tier-h{display:flex;align-items:center;gap:8px;color:var(--cc);margin-bottom:8px;flex-wrap:wrap}
.rk-tier-h b{color:var(--color-text);font-size:var(--text-sm)}
.rk-tier p{font-size:12px;color:var(--color-text-2);min-height:48px;line-height:1.5;margin:0}
.rk-tier .pillbar{width:100%}
.rk-ctrl{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:var(--r-full);
  background:color-mix(in srgb, var(--cc) 9%, transparent);border:1px solid color-mix(in srgb, var(--cc) 22%, transparent);font-size:12px}
.rk-ctrl.lg{display:flex;padding:9px 12px}
.rk-ctrl-t{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;color:var(--cc);white-space:nowrap}
.rk-ctrl-e{font-size:11px;font-weight:800;color:var(--cc);white-space:nowrap}

/* ---------- hazard detail ---------- */
.rk-score{min-width:118px;border-radius:14px;background:var(--lb);padding:12px 16px;text-align:center;flex:none}
.rk-score-v{font-size:34px;font-weight:800;color:var(--lc);line-height:1}
.rk-score-l{font-size:11px;color:var(--lc);font-weight:800;margin-top:4px;line-height:1.35}
.rk-meta4 span{display:inline-flex;gap:6px;align-items:center;font-size:12px;color:var(--color-text-2)}
.rk-cons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.rk-con{display:flex;gap:10px;border:1px solid var(--color-border);border-radius:10px;padding:10px;align-items:flex-start}
.rk-con-ic{width:34px;height:34px;flex:none;border-radius:9px;display:flex;align-items:center;justify-content:center}
.rk-con-ic.red{background:var(--red-50);color:var(--red-600)}
.rk-con-ic.amber{background:var(--amber-50);color:var(--amber-600)}
.rk-con-ic.blue{background:var(--blue-50);color:var(--color-primary)}
.rk-con-l{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--color-text-3);font-weight:800;margin-bottom:2px}
.rk-con b{font-size:12px;line-height:1.4}
.rk-acc{border-radius:12px;background:var(--lb);padding:12px;display:flex;flex-direction:column;gap:3px}
.rk-acc b{color:var(--lc)}
.rk-acc span{font-size:12px}
.rk-ppe{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--color-border);border-radius:10px;font-size:var(--text-sm)}
.rk-photos{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}

/* ---------- register tree ---------- */
.rk-tree{display:flex;flex-direction:column;gap:8px}
.rk-tnode{border:1px solid var(--color-border);border-radius:var(--r-lg);background:var(--color-surface);overflow:hidden}
.rk-trow{display:flex;width:100%;gap:10px;align-items:center;padding:10px 12px;background:none;border:0;cursor:pointer;
  text-align:left;font-size:var(--text-sm);font-family:inherit;color:inherit}
.rk-trow:hover{background:var(--color-bg)}
.rk-trow .c-3{font-size:11px}
.rk-trow:focus-visible,.rk-srow:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}
.rk-tkids{border-top:1px dashed var(--color-border);padding:8px 12px 12px;display:flex;flex-direction:column;gap:2px}
.rk-srow{display:flex;gap:6px;align-items:center;background:none;border:0;font-size:12px;font-weight:700;color:var(--color-text-2);
  cursor:pointer;padding:7px 0;width:100%;text-align:left;font-family:inherit}
.rk-tlist{display:flex;flex-direction:column;gap:2px;margin:2px 0 8px 18px}
.rk-titem{display:flex;gap:10px;align-items:center;padding:5px 8px;border-radius:8px;text-decoration:none;color:inherit;font-size:12px}
.rk-titem:hover{background:var(--blue-25,#F4F8FF);text-decoration:none}
.rk-titem .flex-1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- review strips ---------- */
.rk-reviewstrip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.rk-rv-card{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--color-border);
  border-radius:var(--r-lg);text-decoration:none;color:inherit;background:var(--color-surface);transition:border-color .12s}
.rk-rv-card:hover{border-color:var(--blue-300);text-decoration:none}
.rk-rv-card b{font-size:12px;line-height:1.35}
.rk-rv-card .c-3{font-size:11px}

/* ---------- heat side panel ---------- */
.rk-plant{display:flex;flex-direction:column;gap:5px}
.rk-hbar{display:flex;height:9px;border-radius:6px;overflow:hidden;background:var(--color-bg);gap:1px}
.rk-hbar span{height:100%}

/* ---------- nav tiles ---------- */
.rk-nav-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.rk-nav{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--color-border);border-radius:12px;
  text-decoration:none;color:inherit;background:var(--color-surface);transition:border-color .12s,box-shadow .12s}
.rk-nav:hover{border-color:var(--blue-300);box-shadow:var(--shadow-sm);text-decoration:none}
.rk-nav b{display:block;font-size:12.5px}
.rk-nav span span{display:block;font-size:10.5px;color:var(--color-text-3);margin-top:1px;line-height:1.35}
.rk-nav-ic{width:34px;height:34px;flex:none;border-radius:9px;background:var(--blue-50);color:var(--color-primary);
  display:inline-flex;align-items:center;justify-content:center}

/* ---------- executive ---------- */
.exec-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.exec-kpi{--ec:var(--blue-600);display:flex;gap:14px;align-items:center;border-radius:var(--r-xl);padding:18px;
  border:1px solid color-mix(in srgb, var(--ec) 22%, var(--color-border));background:var(--color-surface);
  position:relative;overflow:hidden;box-shadow:var(--shadow-xs)}
.exec-kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--ec)}
.exec-kpi.blue{--ec:var(--blue-600)} .exec-kpi.red{--ec:var(--red-500)} .exec-kpi.teal{--ec:var(--teal-600,#0E9C8E)} .exec-kpi.amber{--ec:var(--amber-500)}
.exec-ic{width:46px;height:46px;flex:none;border-radius:13px;background:color-mix(in srgb, var(--ec) 12%, transparent);color:var(--ec);
  display:flex;align-items:center;justify-content:center}
.exec-ic svg{width:22px;height:22px}
.exec-v{font-size:27px;font-weight:800;line-height:1.1}
.exec-l{font-size:12px;font-weight:700;color:var(--color-text-2);margin-top:1px}
.exec-s{font-size:11px;color:var(--color-text-3);margin-top:2px}

/* ---------- reports ---------- */
.rk-repgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.rep-card{border:1px solid var(--color-border);border-radius:var(--r-lg);padding:16px;background:var(--color-surface);
  display:flex;flex-direction:column;transition:border-color .12s,box-shadow .12s}
.rep-card:hover{border-color:var(--blue-300);box-shadow:var(--shadow-md)}
.rep-card .rk-nav-ic{background:color-mix(in srgb, var(--cc) 12%, transparent);color:var(--cc)}
.rep-card h4{font-size:var(--text-md);margin:10px 0 4px}
.rep-card p{font-size:12px;color:var(--color-text-2);min-height:52px;margin:0;line-height:1.5}
.rep-card .cat-meta{margin:10px 0}

/* ---------- misc ---------- */
.rk-kvbig .kv-i{padding:10px 0}
.rk-reviewstrip .rk-rv-card:first-child{border-left:3px solid var(--amber-500)}

/* ============================================================
   PRINT — scoped to report previews only
   ============================================================ */
@media print{
  body:has(.risk-print) *{visibility:hidden}
  body:has(.risk-print) .risk-print, body:has(.risk-print) .risk-print *{visibility:visible}
  body:has(.risk-print) .risk-print{position:absolute;left:0;top:0;width:100%;padding:0}
}

/* ============================================================
   RESPONSIVE — Laptop / Tablet
   ============================================================ */
@media (max-width:1200px){
  .rk-catgrid{grid-template-columns:repeat(3,1fr)}
  .rk-nav-grid{grid-template-columns:repeat(3,1fr)}
  .rk-repgrid{grid-template-columns:repeat(3,1fr)}
  .rk-reviewstrip{grid-template-columns:repeat(3,1fr)}
  .rk-scale{grid-template-columns:repeat(3,1fr)}
  .rk-tiers{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .rk-cards{grid-template-columns:repeat(2,1fr)}
  .rk-catgrid{grid-template-columns:repeat(2,1fr)}
  .exec-grid{grid-template-columns:repeat(2,1fr)}
  .rk-repgrid{grid-template-columns:repeat(2,1fr)}
  .rk-reviewstrip{grid-template-columns:repeat(2,1fr)}
  .rk-scale{grid-template-columns:repeat(2,1fr)}
  .rk-tiers{grid-template-columns:repeat(2,1fr)}
  .rk-nav-grid{grid-template-columns:repeat(2,1fr)}
  .rmx{grid-template-rows:repeat(5,minmax(44px,1fr)) 16px 14px}
  .heat{grid-template-rows:repeat(5,minmax(64px,1fr)) 18px 16px}
  .heat-n{font-size:18px}
  .rk-cons{grid-template-columns:1fr}
  .rk-fb .ctl{max-width:none}
  .pyr-tier{padding:9px 10px}
  .pyr-tier b{font-size:12px}
}
@media (max-width:560px){
  .rk-cards{grid-template-columns:1fr}
  .rk-catgrid{grid-template-columns:1fr}
  .exec-grid{grid-template-columns:1fr}
  .rk-repgrid{grid-template-columns:1fr}
  .rk-reviewstrip{grid-template-columns:1fr}
  .rk-scale{grid-template-columns:1fr}
  .rk-tiers{grid-template-columns:1fr}
  .rk-nav-grid{grid-template-columns:1fr}
  .rk-axis{flex-wrap:wrap}
  .axis-pick{flex:1 1 44%}
  .rk-score{align-self:flex-start}
  .rmx-lv{font-size:8px}
  .heat-n{font-size:15px}
}