/* Demo: cloud backup and recovery. Scoped to #br. */

/* shared bits */
#br .br-h{margin:0;font:600 1.22rem/1.3 var(--body);font-stretch:normal;text-transform:none;letter-spacing:-.005em;color:var(--ink)}
#br .br-ic,#br .br-node-ic,#br .br-scn-ic{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:10px;color:var(--cloud);background:linear-gradient(#F2F8FD,#E1EEFA);border:1px solid #1f6fb22b}
#br .br-ic .icon,#br .br-scn-ic .icon{width:19px;height:19px}
#br .btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}
#br .br-play.is-busy{opacity:.78;cursor:progress}

/* bad-day picker */
#br .br-pick{margin:0 0 16px}
#br .br-pick-h{margin:0 0 10px;font:700 .82rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#br .br-scns{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@media(min-width:860px){#br .br-scns{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
#br .br-scn{display:grid;grid-template-columns:40px minmax(0,1fr) 20px;gap:12px;align-items:start;width:100%;min-height:44px;margin:0;padding:14px;text-align:left;font:400 1rem/1.35 var(--body);text-transform:none;letter-spacing:0;color:var(--ink);background:#fff;border:1px solid var(--line-strong);border-radius:12px;box-shadow:var(--shadow-xs);cursor:pointer;transition:border-color .15s,box-shadow .15s,background-color .15s}
#br .br-scn:hover{border-color:var(--navy)}
#br .br-scn[aria-pressed="true"]{border-color:var(--orange);background:#FFF9F4;box-shadow:0 0 0 3px #f26b1d1f}
#br .br-scn[aria-pressed="true"] .br-scn-ic{color:#fff;background:linear-gradient(#2479C0,#1F6FB2);border-color:#1A609B}
#br .br-scn-b{display:grid;gap:2px;min-width:0}
#br .br-scn-k{font:700 .72rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#br .br-scn-b b{font-weight:600;font-size:1.02rem;line-height:1.3;color:var(--ink)}
#br .br-scn-w{font-size:.88rem;color:var(--muted)}
#br .br-radio{width:20px;height:20px;margin-top:2px;border-radius:50%;border:2px solid var(--line-strong);background:#fff;transition:border-color .15s,box-shadow .15s}
#br .br-scn[aria-pressed="true"] .br-radio{border-color:var(--orange);background:var(--orange);box-shadow:inset 0 0 0 4px #fff}

/* window and its three sections */
#br .dk-window-hd .br-biz{color:var(--muted);font-weight:500}
#br .br-sec{padding:22px 24px 24px}
#br .br-sec+.br-sec{border-top:1px solid var(--line)}
#br .br-sec-hd{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:start;gap:10px 14px;margin:0 0 18px}
#br .br-num{flex:none;display:grid;place-items:center;width:28px;height:28px;margin-top:1px;border-radius:50%;background:var(--navy);color:#fff;font:700 .92rem/1 var(--head)}
#br .br-sec-t{min-width:0}
#br .br-sec-s{margin:3px 0 0;font-size:.94rem;line-height:1.45;color:var(--muted)}
#br .br-sec-chip{margin-top:4px}
#br .br-from{display:inline-flex;align-items:center;gap:7px;margin:2px 0 0;padding:5px 12px;border-radius:var(--r-pill);background:var(--cloud-bg);border:1px solid #1f6fb22b;color:var(--cloud);font:600 .86rem/1.2 var(--body)}
#br .br-from .icon{width:16px;height:16px}
#br .br-foot{display:flex;align-items:center;gap:8px;margin:0;padding:10px 20px;border-top:1px solid var(--line);background:#FBFCFD;font-size:.84rem;color:var(--muted);max-width:none}
#br .br-foot .icon{width:15px;height:15px}

/* 1. what happens */
#br .br-story-grid{display:grid;gap:20px;grid-template-columns:minmax(0,1fr)}
@media(min-width:860px){#br .br-story-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:30px}}
#br .br-tl-wrap .dk-pane-h{margin-bottom:14px}
#br .br-tl-live{list-style:none;margin:0;padding:0;min-height:40px}
#br .br-tl-live li{display:grid;grid-template-columns:84px minmax(0,1fr);column-gap:14px}
#br .br-tl-live time{padding-top:1px;font:600 .86rem/1.5 var(--body);color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
#br .br-tl-t{position:relative;padding:0 0 16px 22px;border-left:2px solid var(--line);font-size:.96rem;line-height:1.5;color:var(--ink-2)}
#br .br-tl-live li:last-child .br-tl-t{border-left-color:transparent;padding-bottom:0}
#br .br-tl-t::before{content:"";position:absolute;left:-8px;top:5px;width:14px;height:14px;box-sizing:border-box;border-radius:50%;background:#fff;border:2px solid var(--line-strong)}
#br .br-tl-live li.is-hit time{color:var(--bad)}
#br .br-tl-live li.is-hit .br-tl-t{color:var(--ink);font-weight:500}
#br .br-tl-live li.is-hit .br-tl-t::before{background:var(--bad);border-color:var(--bad);box-shadow:0 0 0 4px #b3261e1f}
#br .br-step-tag{display:inline-block;margin-left:8px;padding:2px 8px;vertical-align:1px;border-radius:var(--r-pill);border:1px solid #1f6fb233;background:var(--cloud-bg);color:var(--cloud);font:700 .72rem/1.25 var(--head);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}

#br .br-plan{position:relative;align-self:start;padding:16px 18px 16px 20px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden}
#br .br-plan::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--cloud)}
#br .br-plan-k{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line);font:700 .78rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--ai)}
#br .br-plan-k .icon{width:16px;height:16px;color:var(--cloud)}
#br .br-plan-k span{margin-left:auto;font:500 .82rem/1.2 var(--body);letter-spacing:0;text-transform:none;color:var(--muted)}
#br .br-plan-t{margin:0 0 10px;font-weight:600;line-height:1.35;color:var(--ink)}
#br .br-plan-l{list-style:none;margin:0;padding:0;counter-reset:brp;display:grid;gap:4px}
#br .br-plan-l li{counter-increment:brp;display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:.93rem;line-height:1.45;color:var(--ink-2);transition:background-color .3s,color .3s}
#br .br-plan-l li::before{content:counter(brp);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ai-bg);color:var(--ai);font:700 .82rem/1 var(--head);transition:background-color .3s,color .3s}
#br .br-plan-l li.is-on{background:#FFF4EC;color:var(--ink)}
#br .br-plan-l li.is-on::before{background:var(--orange);color:#fff}

/* why sync isn't a backup (bad day 3) */
#br .br-sync{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);margin-top:22px}
@media(min-width:760px){#br .br-sync{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}}
#br .br-sync-a,#br .br-sync-b{padding:14px 16px;border-radius:12px;border:1px solid}
#br .br-sync-a{background:#FFF8F7;border-color:#b3261e29}
#br .br-sync-b{background:#F4FAF6;border-color:#1b6e3529}
#br .br-sync-h{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-weight:600;line-height:1.3;color:var(--ink)}
#br .br-sync-h .icon{width:17px;height:17px}
#br .br-sync-a .br-sync-h .icon{color:var(--bad)}
#br .br-sync-b .br-sync-h .icon{color:var(--ok)}
#br .br-sync-p{margin:0 0 12px;font-size:.92rem;line-height:1.45;color:var(--ink-2)}
#br .br-devs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
#br .br-devs li{position:relative;display:flex;align-items:center;gap:8px;padding:6px 8px 6px 10px;border-radius:10px;background:#fff;border:1px solid var(--line);font-size:.88rem;font-weight:500;color:var(--ink)}
#br .br-devs .icon{width:16px;height:16px;color:var(--muted)}
@media(min-width:1000px){#br .br-devs{gap:8px 18px}#br .br-devs li+li::before{content:"";position:absolute;right:100%;top:50%;width:18px;border-top:2px dotted #b3261e73}}
#br .br-keep{display:flex;align-items:center;gap:8px;width:fit-content;max-width:100%;margin:0;padding:7px 12px;border-radius:10px;background:#fff;border:1px solid #1b6e3533;font-weight:600;font-size:.9rem;color:var(--ok)}
#br .br-keep .icon{width:17px;height:17px}

/* 2. restore points + files */
#br .br-r-grid{display:grid;grid-template-columns:minmax(0,1fr);border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
@media(min-width:860px){#br .br-r-grid{grid-template-columns:minmax(0,310px) minmax(0,1fr)}#br .br-pts-pane{border-right:1px solid var(--line)}}
@media(max-width:859px){#br .br-pts-pane{border-bottom:1px solid var(--line)}}
#br .br-pts-pane{background:#FBFCFD;padding:14px 0 8px}
#br .br-pts-pane .dk-pane-h{padding:0 16px;margin-bottom:6px}
#br .br-pts-live{position:relative}
#br .br-pts-live::before{content:"";position:absolute;left:22px;top:20px;bottom:20px;width:2px;background:var(--line)}
#br .br-pt{display:grid;grid-template-columns:14px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;min-height:54px;margin:0;padding:8px 14px 8px 13px;border:0;border-left:3px solid transparent;background:transparent;text-align:left;font:400 .94rem/1.3 var(--body);text-transform:none;letter-spacing:0;color:var(--ink);cursor:pointer;transition:background-color .15s,border-color .15s}
#br .br-pt:hover{background:#F2F5F8}
#br .br-pt[aria-pressed="true"]{background:#FFF4EC;border-left-color:var(--orange)}
#br .br-pt:focus-visible{outline-offset:-3px}
#br .br-pt-dot{position:relative;z-index:1;width:14px;height:14px;box-sizing:border-box;border-radius:50%;background:var(--ok);border:2px solid #fff;box-shadow:0 0 0 1px #1b6e3566}
#br .br-pt--after[data-tone="bad"] .br-pt-dot{background:var(--bad);box-shadow:0 0 0 1px #b3261e66}
#br .br-pt--after[data-tone="warn"] .br-pt-dot{background:#D99A1E;box-shadow:0 0 0 1px #8a5a0066}
#br .br-pt--after[data-tone="mute"] .br-pt-dot{background:#fff;border:2px solid var(--line-strong);box-shadow:none}
#br .br-pt-b{display:grid;min-width:0}
#br .br-pt-b b{font-weight:600;font-variant-numeric:tabular-nums}
#br .br-pt-b small{font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#br .br-pt .dk-chip{padding:3px 8px}
#br .br-hit{position:relative;z-index:1;display:flex;align-items:center;gap:8px;margin:2px 0;padding:7px 14px 7px 15px;background:var(--bad-bg);border-block:1px dashed #b3261e66;font-size:.86rem;line-height:1.3;color:var(--bad)}
#br .br-hit .icon{width:16px;height:16px}
#br .br-hit b{font-weight:700;font-variant-numeric:tabular-nums}
#br .br-hit span{color:#7A1A14}

#br .br-files-pane{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:400px;padding:16px 18px 18px}
#br .br-ph,#br .br-empty{display:grid;justify-items:center;gap:4px;margin:auto;max-width:34ch;padding:28px 0;text-align:center;color:var(--muted);font-size:.94rem;line-height:1.45}
#br .br-ph b,#br .br-empty b{color:var(--ink);font-weight:600;font-size:1rem}
#br .br-ph-ic{display:grid;place-items:center;width:44px;height:44px;margin-bottom:6px;border-radius:50%;background:#EEF2F6;color:var(--muted)}
#br .br-ph-ic .icon{width:20px;height:20px}
#br .br-empty{margin:0 auto;padding:22px 16px;max-width:none;width:100%;border:1px dashed var(--line-strong);border-radius:10px;background:#FBFCFD}
#br .br-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;font-size:.9rem;color:var(--muted)}
#br .br-crumb b{color:var(--ink);font-weight:600}
#br .br-sep{color:var(--line-strong)}
#br .br-call{display:flex;gap:10px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:10px;border:1px solid;font-size:.92rem;line-height:1.45}
#br .br-call .icon{flex:none;width:17px;height:17px;margin-top:2px}
#br .br-call--bad{background:var(--bad-bg);border-color:#b3261e2e;color:#7A1A14}
#br .br-call--bad .icon{color:var(--bad)}
#br .br-call--ok{background:var(--ok-bg);border-color:#1b6e352e;color:#14532A}
#br .br-call--ok .icon{color:var(--ok)}
#br .br-call--info{background:var(--cloud-bg);border-color:#1f6fb22b;color:#17507F}
#br .br-call--info .icon{color:var(--cloud)}
#br .br-nudge{animation:br-nudge .9s var(--ease)}
@keyframes br-nudge{0%,100%{transform:none}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
#br .br-files{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
#br .br-file{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;gap:10px;align-items:center;min-height:40px;padding:7px 12px;border-bottom:1px solid var(--line);font-size:.92rem}
#br .br-file:last-child{border-bottom:0}
#br .br-file-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
#br .br-file small{color:var(--muted);font-size:.84rem;white-space:nowrap;font-variant-numeric:tabular-nums}
#br .br-file.is-sel{background:#F5F9FD}
#br .br-file.is-locked .br-file-n{color:var(--bad)}
#br .br-file.is-note{background:#FFF8F7}
#br .br-file.is-missing{background:repeating-linear-gradient(-45deg,#FFFBF0 0 8px,#FFF4DB 8px 16px)}
#br .br-file.is-missing .br-file-n{color:var(--muted);text-decoration:line-through;text-decoration-color:#8a5a0080}
#br .br-file .dk-chip{padding:2px 8px}
#br .br-sel{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--cloud);color:#fff}
#br .br-sel .icon{width:12px;height:12px}
#br .br-g{display:grid;place-items:center;width:20px;height:20px;color:var(--muted)}
#br .br-g .icon{width:17px;height:17px}
#br .br-g--folder{color:var(--cloud)}
#br .br-g--sheet::before{content:"";width:14px;height:16px;border-radius:3px;background-color:#2E8A50;background-image:linear-gradient(#ffffffcc 1px,transparent 1px),linear-gradient(90deg,#ffffffcc 1px,transparent 1px);background-size:5px 5px;background-position:1px 1px;box-shadow:0 0 0 1px #1b6e3540}
#br .br-act{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 18px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
#br .br-act-f{flex:1 1 260px;font-size:.9rem;grid-template-columns:minmax(64px,auto) minmax(0,1fr);gap:4px 12px}
#br .br-act-f dt{line-height:1.75}
#br .br-go{flex:none;min-height:44px;padding:9px 16px;font-size:1rem}
#br .br-go .icon{width:1.05em;height:1.05em}
#br .br-go.is-busy{opacity:.85;cursor:progress}
#br .br-go.is-done{opacity:1;cursor:default;color:#fff;background:linear-gradient(#22803F,#1B6E35);border-color:#165C2C;box-shadow:inset 0 1px 0 #ffffff24,0 1px 2px #0e1f331f}
#br .br-prog{display:grid;gap:10px;padding:12px 14px;border-radius:10px;background:#F7F9FC;border:1px solid var(--line)}
#br .br-prog-top{display:flex;justify-content:space-between;gap:10px;font-size:.9rem;color:var(--ink)}
#br .br-prog-top b{font-weight:600}
#br .br-prog-n{color:var(--muted);font-variant-numeric:tabular-nums}
#br .br-prog-steps{list-style:none;margin:0;padding:0;display:grid;gap:5px;font-size:.88rem;color:var(--muted)}
#br .br-prog-steps li{display:flex;align-items:center;gap:9px}
#br .br-prog-steps li::before{content:"";flex:none;width:16px;height:16px;box-sizing:border-box;border-radius:50%;border:2px solid var(--line-strong)}
#br .br-prog-steps li[data-state="now"]{color:var(--ink)}
#br .br-prog-steps li[data-state="now"]::before{border-color:var(--orange);border-top-color:transparent;animation:br-spin .8s linear infinite}
#br .br-prog-steps li[data-state="done"]{color:var(--ink)}
#br .br-prog-steps li[data-state="done"]::before{border:0;background:var(--ok) var(--i-check-white) center/12px no-repeat}
@keyframes br-spin{to{transform:rotate(360deg)}}
#br .br-time{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:.85rem;line-height:1.45;color:var(--muted)}
#br .br-time .icon{flex:none;width:15px;height:15px;margin-top:2px}

/* 3. check that it opens */
#br .br-res-grid{display:grid;gap:20px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){#br .br-res-grid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);align-items:start;gap:26px}}
#br .br-res-l{display:grid;gap:14px;min-width:0}
#br .br-xl{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;box-shadow:var(--shadow-md)}
#br .br-xl-hd{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 14px;border-bottom:1px solid var(--line);background:linear-gradient(#FAFBFC,#F2F5F8);font-size:.93rem}
#br .br-xl-hd b{font-weight:600;color:var(--ink)}
#br .br-xl-hd .dk-chip{margin-left:auto}
#br .br-xl{position:relative}
#br .br-xl-body{overflow-x:auto}
#br .br-xl.is-more::after{content:"";position:absolute;right:0;bottom:0;top:46px;width:36px;pointer-events:none;background:linear-gradient(90deg,#fff0,#fffffff2);border-bottom-right-radius:12px}
#br .br-grid{border-collapse:collapse;width:100%;min-width:520px;font-size:.86rem;line-height:1.35;font-variant-numeric:tabular-nums}
#br .br-grid th,#br .br-grid td{border:1px solid #E4E8ED;padding:6px 9px;text-align:left;vertical-align:top;color:var(--ink)}
#br .br-grid tr>:first-child{border-left:0}
#br .br-grid tr>:last-child{border-right:0}
#br .br-grid tbody tr:last-child>*{border-bottom:0}
#br .br-grid .br-cl td{border-top:0;padding:3px 9px;background:#F3F5F8;color:var(--muted);font:600 .72rem/1.3 var(--body);text-align:center}
#br .br-grid .br-rn{width:30px;padding:6px 4px;background:#F3F5F8;color:var(--muted);font:600 .72rem/1.6 var(--body);text-align:center}
#br .br-grid th{font-weight:700;background:#FAFBFC}
#br .br-grid tr>:nth-child(2){white-space:nowrap}
#br .br-chk{display:grid;gap:12px;align-content:start}
#br .br-ask{margin:0;font-weight:600;line-height:1.4;color:var(--ink)}
#br .br-gap-live{display:flex;gap:10px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:10px;background:var(--warn-bg);border:1px solid #8a5a002e;font-size:.9rem;line-height:1.45;color:#5C3D00}
#br .br-gap-live>.icon{flex:none;width:17px;height:17px;margin-top:2px;color:var(--warn)}
#br .br-gap-live p{margin:0}
#br .br-gap-live b{display:block;font:700 .74rem/1.4 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--warn)}
#br .br-chk-act{margin-top:0}
#br .br-ok .icon{width:1.05em;height:1.05em}
#br .br-done{margin:2px 0 0;font-size:1.02rem;outline:none}
#br .br-log-h{margin:4px 0 0;font:700 .78rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#br .br-log{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
#br .br-log li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px 10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line);font-size:.88rem;line-height:1.4;color:var(--ink-2)}
#br .br-log li:last-child{border-bottom:0}
#br .br-log time{grid-column:1;font-size:.8rem;font-weight:600;color:var(--muted)}
#br .br-log li>span:not(.dk-chip){grid-column:1}
#br .br-log .dk-chip{grid-column:1;justify-self:start;margin-top:4px;padding:2px 8px}
#br .br-log li.is-new{background:#F4FAF6}
#br .br-log li.is-new>span:not(.dk-chip){color:var(--ink);font-weight:500}

/* backup monitor + 3-2-1 (shown with or without JavaScript) */
#br .br-more{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);margin-top:22px}
#br .br-card{min-width:0;padding:20px 22px 22px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
#br .br-card-hd{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 14px;margin:0 0 18px}
#br .br-card-t{flex:1 1 240px;min-width:0}
#br .br-card-s{margin:3px 0 0;font-size:.93rem;line-height:1.45;color:var(--muted)}
#br .br-mon-sum{margin-top:6px}
#br .br-mon-body{display:grid;gap:18px}
#br .br-nights{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px 0}
@media(min-width:900px){#br .br-nights{grid-template-columns:repeat(14,minmax(0,1fr))}}
#br .br-nights li{display:grid;justify-items:center;gap:4px;min-width:0;padding:6px 0;font:600 .84rem/1.2 var(--body);color:var(--ink-2)}
#br.dk-on .br-nights li{padding:0}
#br .br-n{display:grid;justify-items:center;gap:4px;width:100%;min-height:62px;margin:0;padding:6px 0;border:0;border-radius:10px;background:transparent;font:600 .84rem/1.2 var(--body);text-transform:none;letter-spacing:0;color:var(--ink-2);cursor:pointer;transition:background-color .15s}
#br .br-n:hover{background:#F2F5F8}
#br .br-n[aria-pressed="true"]{background:#FFF4EC;color:var(--ink)}
#br .br-n:focus-visible{outline-offset:-2px}
#br .br-n-sq{display:block;width:32px;height:32px;border-radius:8px;background:#2E8A50 var(--i-check-white) center/18px no-repeat;box-shadow:inset 0 -2px 0 #0000001f}
#br li[data-fail] .br-n-sq{background-color:var(--bad);background-image:none;position:relative}
#br li[data-fail] .br-n-sq::before,#br li[data-fail] .br-n-sq::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2.5px;border-radius:2px;background:#fff;transform:translate(-50%,-50%) rotate(45deg)}
#br li[data-fail] .br-n-sq::after{transform:translate(-50%,-50%) rotate(-45deg)}
#br .br-n[aria-pressed="true"] .br-n-sq{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--orange)}
#br .br-n-d{font-variant-numeric:tabular-nums}
#br li[data-fail] .br-n-d{color:var(--bad)}
#br .br-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin:10px 0 0;font-size:.86rem;color:var(--muted)}
#br .br-lg{display:inline-flex;align-items:center;gap:7px}
#br .br-lg::before{content:"";width:12px;height:12px;border-radius:3px;background:#2E8A50}
#br .br-lg--bad::before{background:var(--bad)}
#br .br-lg-hint{margin-left:auto}
#br .br-night{min-width:0}
#br .br-n-hd{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 14px;padding-top:16px;border-top:1px solid var(--line)}
#br .br-n-hd b{font-weight:600;color:var(--ink)}
#br .br-alert{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){#br .br-alert{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr) minmax(0,1fr);gap:14px}}
#br .br-alert>li{display:grid;align-content:start;gap:6px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:#FBFCFD;font-size:.92rem;line-height:1.45;color:var(--ink-2)}
#br .br-alert>li.is-bad{background:#FFF8F7;border-color:#b3261e29}
#br .br-alert>li.is-mail{background:#F5F9FD;border-color:#1f6fb229}
#br .br-alert>li.is-ok{background:#F4FAF6;border-color:#1b6e3529}
#br .br-alert time{font:700 .74rem/1.3 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
#br .br-alert .is-bad time{color:var(--bad)}
#br .br-alert .is-mail time{color:var(--cloud)}
#br .br-alert .is-ok time{color:var(--ok)}
#br .br-alert b{color:var(--ink);font-weight:600}
#br .br-mail{margin-top:4px;padding:12px 14px;border-radius:10px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-xs);font-size:.9rem}
#br .br-mail p{margin:0 0 6px}
#br .br-mail p:last-child{margin:0}
#br .br-mail-s{display:flex;gap:8px;align-items:flex-start;line-height:1.35}
#br .br-mail-s .icon{flex:none;width:16px;height:16px;margin-top:1px;color:var(--cloud)}
#br .br-mail-m{font-size:.82rem;color:var(--muted);padding-bottom:6px;border-bottom:1px solid var(--line)}
#br .br-n-f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}
@media(min-width:900px){#br .br-n-f{grid-template-columns:repeat(4,minmax(0,1fr))}}
#br .br-n-f>div{padding:10px 12px;border-radius:10px;background:#FBFCFD;border:1px solid var(--line)}
#br .br-n-f dt{font:700 .72rem/1.4 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
#br .br-n-f dd{margin:2px 0 0;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
#br .br-n-note{display:flex;align-items:flex-start;gap:8px;margin:12px 0 0;font-size:.92rem;color:var(--ok)}
#br .br-n-note .icon{flex:none;width:17px;height:17px;margin-top:2px}

#br .br-map{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@media(min-width:760px){#br .br-map{grid-template-columns:minmax(0,2.1fr) 30px minmax(0,1fr);align-items:stretch}}
#br .br-site{display:flex;flex-direction:column;padding:12px;border:1.5px dashed var(--line-strong);border-radius:14px;background:#FBFCFD}
#br .br-site--off{border-color:#1f6fb266;background:#F5F9FD}
#br .br-site-h{margin:0 0 10px;font:700 .74rem/1.2 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#br .br-site--off .br-site-h{color:var(--cloud)}
#br .br-site-row{flex:1;display:flex;align-items:stretch;gap:6px}
#br .br-node{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow-xs)}
#br .br-node-ic{width:36px;height:36px;margin-bottom:6px}
#br .br-node-ic .icon{width:18px;height:18px}
#br .br-node b{font-weight:600;line-height:1.3;color:var(--ink)}
#br .br-node small{font-size:.85rem;line-height:1.35;color:var(--muted)}
#br .br-node-t{display:grid;gap:2px;margin-bottom:8px}
#br .br-tag{margin-top:auto;padding:3px 8px;border-radius:var(--r-pill);background:var(--cloud-bg);color:var(--cloud);font:700 .7rem/1.25 var(--head);letter-spacing:.1em;text-transform:uppercase}
#br .br-arrow{flex:none;align-self:center;justify-self:center;width:20px;height:20px;background:var(--line-strong);-webkit-mask:var(--i-arrow) center/contain no-repeat;mask:var(--i-arrow) center/contain no-repeat}
@media(max-width:759px){#br .br-arrow--off{transform:rotate(90deg)}}
#br .br-321-k{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@media(min-width:760px){#br .br-321-k{grid-template-columns:repeat(3,minmax(0,1fr))}}
#br .br-321-k li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:10px;background:var(--cloud-bg)}
#br .br-321-k b{flex:none;min-width:.62em;text-align:center;font:800 2.2rem/1 var(--head);color:var(--cloud)}
#br .br-321-k span{font-size:.9rem;line-height:1.4;color:var(--ink-2)}
#br .br-321-k strong{display:block;font:700 .8rem/1.3 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
#br .br-check{margin:16px 0 0;font-size:.94rem;color:var(--muted);max-width:none}
#br .br-check a{display:inline-block;padding:11px 0;font-weight:600;color:var(--link,var(--cloud))}

/* static fallback (no JavaScript) */
#br:not(.dk-on) .br-src{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
#br .br-s{min-width:0;padding:22px 24px;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
#br .br-s-k{margin:0;font:700 .76rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--bad)}
#br .br-s h3{margin:2px 0 2px;font:600 1.22rem/1.3 var(--body);font-stretch:normal;text-transform:none;letter-spacing:-.005em;color:var(--ink)}
#br .br-s-when{margin:0 0 16px;color:var(--muted)}
#br .br-s-cols{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);margin-bottom:18px}
@media(min-width:860px){#br .br-s-cols{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px}}
#br .br-k{margin:0 0 10px;font:700 .8rem/1.3 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#br .br-tl{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#br .br-tl li{display:grid;grid-template-columns:86px minmax(0,1fr);gap:12px;font-size:.95rem;line-height:1.5;color:var(--ink-2)}
#br .br-tl time{font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
#br .br-tl li[data-hit] time{color:var(--bad)}
#br .br-tl li[data-hit] span{color:var(--ink)}
#br .br-src .br-sync{margin:0 0 18px}
#br .br-pts{list-style:none;margin:0 0 16px;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
#br .br-pts li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:9px 12px;border-bottom:1px solid var(--line);font-size:.93rem}
#br .br-pts li:last-child{border-bottom:0}
#br .br-pts li[data-state="hit"]{background:var(--bad-bg);color:var(--bad)}
#br .br-pts li[data-state="last"]{background:var(--ok-bg)}
#br .br-pts .br-pt-t b{font-weight:600}
#br .br-pts .br-pt-n{color:var(--muted);font-size:.88rem}
#br .br-pts li[data-state="hit"] .br-pt-n{color:#7A1A14}
#br .br-s-rest{margin:0 0 12px;color:var(--ink-2)}
#br .br-sheet-wrap{overflow-x:auto;margin:0 0 12px;border:1px solid var(--line);border-radius:10px}
#br .br-sheet{border-collapse:collapse;width:100%;min-width:480px;font-size:.88rem}
#br .br-sheet caption{padding:9px 12px;text-align:left;font-weight:600;background:#FAFBFC;border-bottom:1px solid var(--line)}
#br .br-sheet th,#br .br-sheet td{padding:6px 10px;border-bottom:1px solid #E4E8ED;text-align:left;vertical-align:top}
#br .br-sheet tbody tr:last-child td{border-bottom:0}
#br .br-gap{margin:0 0 10px;padding:9px 12px;border-radius:10px;background:var(--warn-bg);color:#5C3D00;font-size:.92rem}
#br .br-s-done{display:flex;align-items:center;gap:8px;margin:0;font-weight:600;color:var(--ok)}
#br .br-s-done .icon{width:18px;height:18px}
#br .br-src>.br-time{padding:0 4px}

@media(max-width:600px){
 #br .dk-window-hd .br-biz{display:none}
 #br .br-sec-hd{grid-template-columns:28px minmax(0,1fr);gap:8px 12px}
 #br .br-sec-hd>:nth-child(3){grid-column:2;justify-self:start;margin-top:0}
 #br .br-grid{min-width:0;font-size:.82rem}
 #br .br-grid th,#br .br-grid td{white-space:nowrap}
 #br .br-xl-hd{display:grid;grid-template-columns:20px minmax(0,1fr);gap:6px 10px}
 #br .br-xl-hd .dk-chip{grid-column:2;margin-left:0}
 #br .br-xl.is-more::after{top:74px}
 #br .br-node{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px}
 #br .br-node-ic{margin:0}
 #br .br-node-t{margin:0}
 #br .br-tag{margin:0}
 #br .br-site-row{gap:4px}
 #br .br-sec{padding:18px 16px 20px}
 #br .br-card,#br .br-s{padding:18px 16px}
 #br .br-tl-live li{grid-template-columns:62px minmax(0,1fr);column-gap:12px}
 #br .br-tl-live time{font-size:.8rem}
 #br .br-tl-t{padding-left:18px}
 #br .br-tl li{grid-template-columns:84px minmax(0,1fr);gap:10px}
 #br .br-sheet th,#br .br-sheet td{white-space:nowrap}
 #br .br-files-pane{padding:14px 12px 16px;min-height:0}
 #br .br-file{grid-template-columns:20px minmax(0,1fr) auto;gap:8px}
 #br .br-file small{display:none}
 #br .br-go{flex:1 1 100%}
 #br .br-act-f{flex-basis:100%}
 #br .br-site-row{flex-direction:column}
 #br .br-site-row>.br-arrow{transform:rotate(90deg)}
 #br .br-lg-hint{margin-left:0;flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){
 #br .br-scn,#br .br-pt,#br .br-n,#br .br-plan-l li,#br .br-plan-l li::before{transition:none}
 #br .br-prog-steps li[data-state="now"]::before,#br .br-nudge{animation:none}
}