/* Scene 08 · Quản trị rủi ro (LỆNH 14, 23/10/2026). A WebGL canvas of its own (.g6-gl, pb-gates.js: the route with its three
   checkpoints, on the stage's navy) under the DOM that scene-risk06.js writes from one clock (NQ_CK): the 5 × 5 matrix on the right, the
   checkpoints' names and what each keeps under the road, the wires. Matrix grounds by band (report 3.6): red ≥ 15 · amber 10–14 · green
   < 10; blue = held by a checkpoint / done. HUD as the deck: ONE label (LỆNH 42 §B4: a dark see-through pill, a 1 px light edge, 24 px semibold, tokens at the end of pitch.css), a 1 px leader with a dot at its head. Text ≥ 20 px. */
#s-risk,#s-risk.active{filter:none!important;transform:none!important}
#s-risk .head .h1{font-size:56px}
#s-risk .g6{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:#070D1C}
#s-risk .g6 *{box-sizing:border-box}
#s-risk .g6 p{margin:0}
#s-risk .g6>*{position:absolute;margin:0;left:0;top:0}
#s-risk .head{z-index:6}
#s-risk .g6 .g6-gl{width:1920px;height:1080px;display:block}
#s-risk .g6-still{width:1920px;height:1080px;max-width:none;display:none}
#s-risk.g6-still-on .g6-still{display:block}
#s-risk.g6-still-on .g6 .g6-gl{display:none}
#s-risk .g6-svg{width:1920px;height:1080px;overflow:visible}
#s-risk .g6-svg path{fill:none}
#s-risk .g6-svg .ld{stroke:var(--nq-ld);stroke-width:1;marker-end:url(#nq-ld-dot)}
/* the wires, checkpoint → dot: a blue bed drawn on, a white light running at its head */
#s-risk .g6-svg .wr{stroke:rgba(127,176,255,.9);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1 1}
#s-risk .g6-svg .wr.run{stroke:#fff;stroke-width:3.5;stroke-dasharray:.14 2.14}
#s-risk .g6-svg .wr.halo{stroke:rgba(90,150,255,.32);stroke-width:12;stroke-dasharray:.16 2.16}
#s-risk .g6-src{position:absolute;left:160px;top:212px;margin:0;font-size:20px;font-weight:500;color:#9FB0CA;white-space:nowrap;z-index:5;opacity:0}

/* ---- the matrix ---- */
#s-risk .g6-mx{width:1920px;height:1080px}
#s-risk .g6-mx>*{position:absolute;margin:0}
#s-risk .g6-c{width:72px;height:72px;margin:2px;border-radius:5px;opacity:0;transform-origin:50% 50%}
#s-risk .g6-c.hi{background:rgba(229,72,77,.34);box-shadow:inset 0 0 0 1px rgba(255,138,140,.30)}
#s-risk .g6-c.md{background:rgba(240,166,58,.27);box-shadow:inset 0 0 0 1px rgba(255,200,120,.26)}
#s-risk .g6-c.lo{background:rgba(52,178,123,.20);box-shadow:inset 0 0 0 1px rgba(110,220,170,.20)}
#s-risk .g6-an{width:40px;font:600 20px/28px "JetBrains Mono",ui-monospace,monospace;color:#AFC0D8;text-align:center;opacity:0}
#s-risk .g6-an.y{text-align:right}
#s-risk .g6-at{font-size:22px;font-weight:600;line-height:1.2;color:#C9D6EA;white-space:nowrap;opacity:0}
#s-risk .g6-at.x{left:1200px;top:754px;width:380px;text-align:center}
#s-risk .g6-at.y{left:1102px;top:520px;writing-mode:vertical-rl;transform:translate(-50%,-50%) rotate(180deg)}
#s-risk .g6-leg{left:1135px;top:804px;display:flex;align-items:center;gap:10px;font-size:20px;font-weight:500;line-height:1.2;color:#C9D6EA;white-space:nowrap;opacity:0}
#s-risk .g6-leg i{font-style:normal;color:#7D8BA3}
#s-risk .g6-leg b{display:inline-block;width:18px;height:18px;border-radius:4px}
#s-risk .g6-leg b.hi{background:rgba(229,72,77,.75);box-shadow:inset 0 0 0 1px rgba(255,160,160,.6)}
#s-risk .g6-leg b.md{background:rgba(240,166,58,.7);box-shadow:inset 0 0 0 1px rgba(255,210,140,.6)}
/* the dots: band colour, a pale rim; the source (the highest) the largest, a bright rim and a glow */
#s-risk .g6-dot{left:0;top:0;width:28px;height:28px;opacity:0;pointer-events:auto;cursor:pointer;transform:translate(-50%,-50%)}
#s-risk .g6-dot>b{position:absolute;inset:0;border-radius:50%;background:#E5484D;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55),0 0 0 2px rgba(7,13,28,.85),0 4px 12px rgba(0,0,0,.5)}
#s-risk .g6-dot.md>b{background:#F0A63A}
#s-risk .g6-dot.top{width:40px;height:40px}
#s-risk .g6-dot.top>b{box-shadow:inset 0 0 0 2px rgba(255,255,255,.7),0 0 0 3px #FFE3E3,0 0 18px 4px rgba(255,110,110,.75),0 0 40px 8px rgba(229,72,77,.35)}
#s-risk .g6-dot.blink>b{background:#fff;box-shadow:0 0 0 3px #8FC0FF,0 0 22px 6px rgba(120,170,255,.9)}
#s-risk .g6-dot .rp{position:absolute;inset:-3px;border-radius:50%;border:2px solid #FF8A8C;opacity:0}
#s-risk .g6-dot .rg{position:absolute;inset:-8px;border-radius:50%;border:2.5px solid #6FA6FF;box-shadow:0 0 12px rgba(80,140,255,.65),inset 0 0 8px rgba(80,140,255,.35);opacity:0}
#s-risk .g6-dot.rk-on>b{box-shadow:inset 0 0 0 2px rgba(255,255,255,.8),0 0 0 4px #fff,0 0 22px rgba(255,255,255,.6)}
/* the names: the one label beside the dot */
#s-risk .g6-lb{left:0;top:0;opacity:0;white-space:nowrap;padding:var(--nq-pill-pad);border-radius:999px;font:var(--nq-pill-font);color:var(--nq-pill-ink);
  background:var(--nq-pill-bg);box-shadow:inset 0 0 0 1px var(--nq-pill-edge)}
/* the second plates: the highest risk's reason (a red edge), the two others' handling */
#s-risk .g6-lb.top{font-weight:700}
#s-risk .g6-lb.nt{font-weight:600}
/* the second row's names in the column right of the grid: their handling may wrap (never wider than the column) */
#s-risk .g6-lb.nt.g6-sd{white-space:normal;max-width:262px;padding:8px 16px 10px;border-radius:16px;line-height:1.25;text-wrap:balance;background:var(--nqc-bg);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 28px -12px rgba(0,0,0,.65)}   /* a small v2 card */
#s-risk .g6-lb.nt.g6-sd::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:var(--nqc-edge);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}   /* its 1 px gradient edge */
#s-risk .g6-lb.hl{box-shadow:inset 0 0 0 1px rgba(255,138,140,.92)}
/* the checkpoint's number on a dot it holds */
#s-risk .g6-dot .bd{position:absolute;right:-17px;top:-17px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 20px/1 "JetBrains Mono",ui-monospace,monospace;font-style:normal;color:#fff;
  background:#2A63E6;box-shadow:0 0 0 2px rgba(7,13,28,.9),0 0 12px rgba(42,99,230,.7);opacity:0}

/* ---- beat 2: the checkpoints' names under the road, what each keeps ---- */
#s-risk .g6-gt{opacity:0;white-space:nowrap;display:flex;align-items:center;gap:10px;padding:4px 16px 4px 5px;border-radius:999px;font:var(--nq-pill-font);color:var(--nq-pill-ink);
  background:var(--nq-pill-bg);box-shadow:inset 0 0 0 1px var(--nq-pill-edge)}
#s-risk .g6-gt i{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font:700 20px/1 "JetBrains Mono",ui-monospace,monospace;font-style:normal;color:#CFE0FF;box-shadow:inset 0 0 0 1.5px rgba(143,192,255,.7)}
#s-risk .g6-gt.ok i{color:#fff;background:#2A63E6;box-shadow:0 0 0 2px rgba(143,192,255,.5),0 0 14px rgba(42,99,230,.7)}
#s-risk .g6-rc{opacity:0;white-space:nowrap;display:flex;align-items:center;gap:8px;padding:4px 16px 4px 5px;border-radius:999px;font:var(--nq-pill-font);color:var(--nq-pill-ink);background:var(--nq-pill-bg);
  box-shadow:inset 0 0 0 1px var(--nq-pill-edge);transform-origin:50% 50%;transition:box-shadow .2s}
#s-risk .g6-rc i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font:700 20px/1 "JetBrains Mono",ui-monospace,monospace;font-style:normal;color:#fff;background:#2A63E6}
#s-risk .g6-rc.lit{box-shadow:inset 0 0 0 1px var(--nq-pill-ai-edge),0 0 18px rgba(80,140,255,.55)}

/* ---- a picked risk's card (keys 1–6) ---- */
#s-risk .g6-pn{display:none;max-width:960px;pointer-events:auto}
#s-risk .g6-pn .nq-txt{font-size:26px}
#s-risk .g6-pn .nq-sub{font-size:21px}
#s-risk .g6-pls{display:none!important}
#s-risk .g6-det{display:none!important}
#s-risk :is(.g6-lb,.g6-gt,.g6-rc,.g6-dot,.g6-c){will-change:opacity,transform}