/* CMS Training — interactive CMS simulations (exercise prototypes). Presentation + local state only. */
.cms-sim{--sim-paper:#fff;--sim-ink:#16191d;--sim-line:#c9ced4;--sim-head:#eef1f4;--sim-gold:#efbf63;--sim-gold-d:#9a6a10;--sim-green:#2f9e6a;--sim-red:#c8464f;--sim-blue:#2f7fb5;
  margin:26px 0;padding:0!important;overflow:hidden;border-radius:20px;border:1px solid rgba(239,191,99,.28)!important;background:linear-gradient(160deg,#0a2232,#0d2a3d 70%,#0f3046)!important;color:#f4f1ea}
.cms-sim *{box-sizing:border-box}
.cms-sim .sim-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:24px 26px 16px}
.cms-sim .sim-head h3{margin:6px 0 6px;font-size:23px;line-height:1.25;color:#f4f1ea}
.cms-sim .sim-head p{margin:0;color:#c9d6de;line-height:1.55;max-width:720px}
.cms-sim .sim-flag{display:inline-flex;gap:8px;align-items:center;font:800 12px/1 "CMS Inter",Inter,Arial,sans-serif;letter-spacing:.14em;color:#efbf63}
.cms-sim .sim-flag i{font-style:normal;padding:4px 8px;border-radius:999px;background:#efbf63;color:#051521;letter-spacing:.1em}
.cms-sim .sim-badge{flex:0 0 auto;padding:7px 12px;border-radius:999px;border:1px solid rgba(239,191,99,.45);color:#efbf63;font:700 12px/1 "CMS Inter",Inter,Arial,sans-serif;letter-spacing:.08em}
.cms-sim .sim-steps{display:flex;gap:6px;flex-wrap:wrap;padding:0 26px 16px;margin:0;list-style:none}
.cms-sim .sim-steps li{display:flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(170,195,210,.18);font:600 13px/1.1 "CMS Inter",Inter,Arial,sans-serif;color:#9fb2be}
.cms-sim .sim-steps li b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.08);font-size:11px;color:#c9d6de}
.cms-sim .sim-steps li.on{background:rgba(239,191,99,.16);border-color:#efbf63;color:#f4f1ea}.cms-sim .sim-steps li.on b{background:#efbf63;color:#051521}
.cms-sim .sim-steps li.done{color:#d2dce2}.cms-sim .sim-steps li.done b{background:#7bd0a1;color:#051521}
.cms-sim .sim-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:0;border-top:1px solid rgba(170,195,210,.16)}
.cms-sim .sim-coach{padding:22px 22px 24px;border-left:1px solid rgba(170,195,210,.16);background:rgba(4,15,24,.35)}
.cms-sim .coach-kicker{font:800 11.5px/1 "CMS Inter",Inter,Arial,sans-serif;letter-spacing:.14em;color:#efbf63;margin-bottom:10px}
.cms-sim .coach-task{font-size:17px;line-height:1.45;color:#f4f1ea;font-weight:600;margin:0 0 12px}
.cms-sim .coach-hint{font-size:14px;line-height:1.5;color:#b8c8d2;margin:0 0 12px}
.cms-sim .coach-fb{margin-top:12px;padding:13px 14px;border-radius:12px;font-size:14.5px;line-height:1.5;border:1px solid transparent}
.cms-sim .coach-fb:empty{display:none}
.cms-sim .coach-fb.ok{background:rgba(123,208,161,.12);border-color:rgba(123,208,161,.5);color:#dff5e9}
.cms-sim .coach-fb.no{background:rgba(239,143,151,.12);border-color:rgba(239,143,151,.5);color:#fbe3e5}
.cms-sim .coach-fb.info{background:rgba(100,180,223,.12);border-color:rgba(100,180,223,.45);color:#dcefff}
.cms-sim .coach-fb strong{display:block;margin-bottom:3px;color:#fff}
.cms-sim .sim-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 18px;border-radius:999px;border:1px solid #efbf63;background:#efbf63;color:#051521;font:700 14.5px/1 "CMS Inter",Inter,Arial,sans-serif;cursor:pointer;margin:6px 8px 0 0}
.cms-sim .sim-btn.ghost{background:transparent;color:#efbf63}
.cms-sim .sim-btn[disabled]{opacity:.45;cursor:not-allowed}
.cms-sim .sim-btn:focus-visible,.cms-sim button:focus-visible,.cms-sim select:focus-visible{outline:3px solid #efbf63;outline-offset:2px}
.cms-sim .sim-request{margin:0 0 6px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(170,195,210,.2)}
.cms-sim .sim-request small{display:block;font:800 11px/1 "CMS Inter",Inter,Arial,sans-serif;letter-spacing:.12em;color:#9fb2be;margin-bottom:7px}
.cms-sim .sim-request p{margin:0;color:#f4f1ea;font-size:15px;line-height:1.5}

/* the simulated CMS window */
.cms-sim .csw{margin:18px;border-radius:12px;overflow:hidden;background:var(--sim-paper);color:var(--sim-ink);box-shadow:0 18px 40px -20px rgba(0,0,0,.7);font:14px/1.35 Arial,Helvetica,sans-serif;min-height:420px;display:flex;flex-direction:column}
.cms-sim .csw-top{display:flex;align-items:center;gap:18px;padding:0 14px;height:44px;background:#2c3239;color:#e9edf1}
.cms-sim .csw-top .brand{font-weight:700;font-size:14px;white-space:nowrap}.cms-sim .csw-top .brand em{font-style:normal;font-weight:400;color:#aeb8c2;margin-left:6px;font-size:12px}
.cms-sim .csw-top nav{display:flex;gap:2px;height:100%}
.cms-sim .csw-top nav span{display:flex;align-items:center;padding:0 12px;color:#c8d0d8;font-size:13px}
.cms-sim .csw-top nav span.on{background:#3d454e;color:#fff;box-shadow:inset 0 -3px 0 #efbf63}
.cms-sim .csw-top .clock{margin-left:auto;font-size:12px;color:#c8d0d8;white-space:nowrap}
.cms-sim .csw-main{display:grid;grid-template-columns:190px minmax(0,1fr);flex:1;min-height:376px}
.cms-sim .csw-nav{background:#f4f6f8;border-right:1px solid var(--sim-line);padding:12px 0}
.cms-sim .csw-nav h5{margin:0 0 6px;padding:0 14px;font-size:12px;color:#7a838c;text-transform:uppercase;letter-spacing:.06em}
.cms-sim .csw-nav button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:6px;padding:9px 14px;border:0;background:none;text-align:left;font:14px Arial,Helvetica,sans-serif;color:#1d2228;cursor:pointer}
.cms-sim .csw-nav button:hover{background:#e7ecf0}
.cms-sim .csw-nav button.on{background:#dfe6ec;font-weight:700;box-shadow:inset 4px 0 0 var(--sim-gold)}
.cms-sim .csw-nav button.sub{padding-left:28px;font-size:13.5px}
.cms-sim .csw-nav button.wrong{box-shadow:inset 4px 0 0 var(--sim-red)}
.cms-sim .csw-pane{padding:16px 18px;overflow:auto}
.cms-sim .csw-pane h4{margin:0 0 10px;font-size:16px;color:#1d2228}
.cms-sim .csw-empty{display:grid;place-items:center;height:100%;color:#7a838c;text-align:center;padding:30px}
.cms-sim .rep-list{width:100%;border-collapse:collapse}
.cms-sim .rep-list td{padding:10px 10px;border-bottom:1px solid #e3e7eb;vertical-align:top}
.cms-sim .rep-list tr{cursor:pointer}.cms-sim .rep-list tr:hover td{background:#f3f6f8}
.cms-sim .rep-list tr.on td{background:#fff4dc}.cms-sim .rep-list tr.wrong td{background:#fde9ea}
.cms-sim .rep-list td:first-child{font-weight:700;white-space:nowrap;width:42%}
.cms-sim .rep-list td:last-child{color:#4b545c}
.cms-sim .csw-toolbar{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.cms-sim .csw-toolbar span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--sim-line);border-radius:6px;font-size:13px;color:#2f363d;background:#fff}
.cms-sim .rep-meta{display:grid;grid-template-columns:auto auto;justify-content:center;gap:2px 10px;margin:4px 0 12px;font-size:13px}
.cms-sim .rep-meta b{font-size:14px}
.cms-sim .rep-wrap{overflow-x:auto;border:1px solid var(--sim-line)}
.cms-sim table.rep{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}
.cms-sim table.rep th{background:var(--sim-head);border:1px solid var(--sim-line);padding:8px 8px;font-weight:400;text-align:center;line-height:1.2}
.cms-sim table.rep th.click{cursor:pointer}.cms-sim table.rep th.click:hover{background:#e2e8ee}
.cms-sim table.rep td{border-left:1px solid #edf0f2;border-right:1px solid #edf0f2;padding:8px 9px;text-align:right;white-space:nowrap}
.cms-sim table.rep td:first-child{text-align:left}
.cms-sim table.rep tr.tot td{font-weight:700;border-bottom:1px solid var(--sim-line)}
.cms-sim table.rep tbody tr.pick{cursor:pointer}.cms-sim table.rep tbody tr.pick:hover td{background:#f3f6f8}
.cms-sim table.rep .hl{background:#fff1cf!important}
.cms-sim table.rep th.hl{background:#f7d98f!important;font-weight:700}
.cms-sim table.rep tr.sel td{background:#fff1cf!important;font-weight:700}
.cms-sim table.rep tr.bad td{background:#fde9ea!important}
.cms-sim .dlg{max-width:520px;margin:6px auto;border:1px solid var(--sim-line);border-radius:10px;box-shadow:0 10px 30px -14px rgba(0,0,0,.35);background:#fff}
.cms-sim .dlg header{padding:12px 16px;border-bottom:1px solid var(--sim-line);font-weight:700;background:#f7f9fa;border-radius:10px 10px 0 0}
.cms-sim .dlg .row{display:grid;grid-template-columns:150px 1fr;gap:10px;align-items:center;padding:10px 16px}
.cms-sim .dlg label{font-size:13.5px;color:#2f363d}
.cms-sim .dlg select{width:100%;padding:8px 10px;border:1px solid #9aa5af;border-radius:6px;font:14px Arial,Helvetica,sans-serif;background:#fff;color:#16191d}
.cms-sim .dlg footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--sim-line)}
.cms-sim .dlg footer button{padding:8px 16px;border-radius:6px;border:1px solid #2c3239;background:#2c3239;color:#fff;font:700 14px Arial,Helvetica,sans-serif;cursor:pointer}
.cms-sim .dlg footer button.sec{background:#fff;color:#2c3239}
.cms-sim .detail{margin-top:14px;border:1px solid var(--sim-line);border-radius:8px;overflow:hidden}
.cms-sim .detail header{padding:9px 12px;background:#f7f9fa;border-bottom:1px solid var(--sim-line);font-weight:700;font-size:13.5px}
.cms-sim .sim-note{font-size:12px;color:#6b747c;margin-top:8px}

/* findings */
.cms-sim .find-list{display:grid;gap:10px;margin:4px 0 0}
.cms-sim .find{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--sim-line);border-radius:10px;background:#fff}
.cms-sim .find p{margin:0;font-size:14.5px;line-height:1.45;color:#1d2228}
.cms-sim .find .tog{display:inline-flex;border:1px solid #9aa5af;border-radius:999px;overflow:hidden}
.cms-sim .find .tog button{padding:7px 12px;border:0;background:#fff;font:700 12.5px Arial,Helvetica,sans-serif;color:#4b545c;cursor:pointer}
.cms-sim .find .tog button.on{background:#2c3239;color:#fff}
.cms-sim .find.res-ok{border-color:var(--sim-green);background:#effaf4}.cms-sim .find.res-no{border-color:var(--sim-red);background:#fdf0f1}
.cms-sim .find .why{grid-column:1/-1;font-size:13.5px;line-height:1.45;color:#2f363d;display:none}
.cms-sim .find.res-ok .why,.cms-sim .find.res-no .why{display:block}
.cms-sim .find .why b{color:var(--sim-green)}.cms-sim .find.res-no .why b{color:var(--sim-red)}

/* real-time */
.cms-sim .rt-wrap{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;align-items:start}
.cms-sim table.vrep{width:100%;border-collapse:collapse;font-size:13.5px}
.cms-sim table.vrep td{border:1px solid var(--sim-line);padding:7px 9px}
.cms-sim table.vrep td:first-child{background:#fafbfc;width:62%}
.cms-sim table.vrep td:last-child{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.cms-sim table.vrep tr.click{cursor:pointer}.cms-sim table.vrep tr.click:hover td{background:#f3f6f8}
.cms-sim table.vrep tr.pick td{background:#fff1cf!important}
.cms-sim table.vrep tr.flash td:last-child{animation:simflash .6s ease}
@keyframes simflash{from{background:#ffe3a3}to{background:transparent}}
.cms-sim .ctx{margin-top:12px;padding:12px 14px;border-radius:8px;background:#f3f6f8;border:1px solid var(--sim-line);font-size:13.5px;line-height:1.5}
.cms-sim .ctx small{display:block;font-size:11px;letter-spacing:.08em;color:#6b747c;text-transform:uppercase;margin-bottom:4px}
.cms-sim .sim-state{display:inline-block;min-width:58px;padding:3px 8px;border-radius:999px;font:700 12px Arial,Helvetica,sans-serif;text-align:center;color:#071a26}
.cms-sim .s-ACD{background:#64b4df}.cms-sim .s-ACW{background:#b9a4f4}.cms-sim .s-AUX{background:#e7a565}.cms-sim .s-AVAIL{background:#7bd0a1}.cms-sim .s-RING{background:#efbf63}
.cms-sim .acts{display:grid;gap:8px;margin-top:6px}
.cms-sim .act{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;padding:11px 12px;border:1px solid rgba(170,195,210,.25);border-radius:10px;background:rgba(255,255,255,.04);color:#e8eef2;cursor:pointer;text-align:left;font:14px/1.4 "CMS Inter",Inter,Arial,sans-serif}
.cms-sim .act i{width:20px;height:20px;border-radius:6px;border:2px solid #9fb2be;margin-top:1px}
.cms-sim .act.on{border-color:#efbf63;background:rgba(239,191,99,.12)}.cms-sim .act.on i{background:#efbf63;border-color:#efbf63}
.cms-sim .act[disabled]{cursor:default;opacity:.95}
.cms-sim .act.res-ok{border-color:#7bd0a1}.cms-sim .act.res-mixed{border-color:#efbf63}.cms-sim .act.res-no{border-color:#ef8f97}
.cms-sim .act .why{grid-column:2;font-size:13px;color:#c9d6de;display:none;margin-top:4px}
.cms-sim .act.res-ok .why,.cms-sim .act.res-mixed .why,.cms-sim .act.res-no .why{display:block}
.cms-sim .chart{margin-top:14px;border:1px solid var(--sim-line);border-radius:8px;padding:10px 12px 6px;background:#fff}
.cms-sim .chart h5{margin:0 0 4px;font-size:13px;color:#2f363d}
.cms-sim .chart svg{display:block;width:100%;height:auto}
.cms-sim .legend{display:flex;gap:16px;font-size:12px;color:#4b545c;margin-top:4px}
.cms-sim .legend span::before{content:"";display:inline-block;width:18px;height:3px;margin-right:6px;vertical-align:middle;background:var(--c)}
@container cmssim (max-width:1000px){.cms-sim .sim-body{grid-template-columns:1fr}.cms-sim .sim-coach{border-left:0;border-top:1px solid rgba(170,195,210,.16)}.cms-sim .rt-wrap{grid-template-columns:1fr}}
@container cmssim (max-width:620px){.cms-sim .sim-head{padding:20px 18px 12px}.cms-sim .sim-steps{padding:0 18px 14px}.cms-sim .sim-badge{display:none}.cms-sim .csw{margin:12px}
  .cms-sim .csw-main{grid-template-columns:1fr}.cms-sim .csw-nav{display:flex;flex-wrap:wrap;gap:4px;padding:8px;border-right:0;border-bottom:1px solid var(--sim-line)}.cms-sim .csw-nav h5{width:100%;padding:0 4px}
  .cms-sim .csw-nav button{width:auto;border-radius:6px;padding:7px 10px}.cms-sim .csw-nav button.sub{padding-left:10px}.cms-sim .csw-top nav{display:none}.cms-sim .dlg .row{grid-template-columns:1fr}
  .cms-sim .find{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.cms-sim table.vrep tr.flash td:last-child{animation:none}}

/* Lesson column is ~800px wide: size by the exercise's own width, and keep the coach above the CMS window when stacked. */
.cms-sim{container:cmssim/inline-size}
@container cmssim (max-width:1000px){.cms-sim .sim-coach{order:-1;border-top:0;border-bottom:1px solid rgba(170,195,210,.16);padding-bottom:16px}.cms-sim .csw-main{grid-template-columns:160px minmax(0,1fr)}.cms-sim .csw{margin:16px 18px 18px}}
@container cmssim (max-width:620px){.cms-sim .csw-main{grid-template-columns:1fr}}
/* production-dark.css forces light text on every table (with !important); the simulated CMS window is a light screen. */
.demo-one .cms-sim .csw table,.demo-one .cms-sim .csw th,.demo-one .cms-sim .csw td{color:var(--sim-ink)!important;border-color:var(--sim-line)!important}
.demo-one .cms-sim .csw .sim-note{color:#5b646c!important}
.demo-one .cms-sim .csw select,.demo-one .cms-sim .csw label,.demo-one .cms-sim .csw h4,.demo-one .cms-sim .csw h5{color:var(--sim-ink)!important}
.demo-one .cms-sim.cms-sim .csw.csw p,.demo-one .cms-sim.cms-sim .csw.csw li,.demo-one .cms-sim .csw span:not(.sim-state){color:var(--sim-ink)!important}
.demo-one .cms-sim.cms-sim .csw.csw p.sim-note{color:#5b646c!important}
.demo-one .cms-sim .csw .csw-top span{color:#c8d0d8!important}.demo-one .cms-sim .csw .csw-top span.on,.demo-one .cms-sim .csw .csw-top .brand,.demo-one .cms-sim .csw .csw-top .clock{color:#fff!important}.demo-one .cms-sim .csw .csw-top .brand em{color:#aeb8c2!important}
.demo-one .cms-sim .sim-coach p.coach-task{color:#eef3f5!important}
@container cmssim (max-width:1000px){.cms-sim table.rep{font-size:12.5px}.cms-sim table.rep th,.cms-sim table.rep td{padding:6px 6px}}
/* styles.css forces 12px grey paragraphs inside .interactive-lab (with !important); restore the simulation's own type scale. */
.v9-lesson-main .cms-sim.cms-sim p,.demo-one .cms-sim.cms-sim p{line-height:1.45!important}
.v9-lesson-main .cms-sim.cms-sim .sim-head p{font-size:15px!important;color:#c9d6de!important;line-height:1.55!important}
.v9-lesson-main .cms-sim.cms-sim .coach-task{font-size:17px!important;color:#f4f1ea!important}
.v9-lesson-main .cms-sim.cms-sim .coach-hint{font-size:14px!important;color:#b8c8d2!important;line-height:1.5!important}
.v9-lesson-main .cms-sim.cms-sim .sim-request p{font-size:15px!important;color:#f4f1ea!important;line-height:1.5!important}
.v9-lesson-main .cms-sim.cms-sim .find p{font-size:14.5px!important;color:#1d2228!important}
.v9-lesson-main .cms-sim.cms-sim .csw p.sim-note{font-size:12px!important;color:#5b646c!important}
.cms-sim .sim-left,.cms-sim .csw,.cms-sim .csw-pane{min-width:0}@container cmssim (max-width:1000px){.cms-sim .sim-body{grid-template-columns:minmax(0,1fr)}}@container cmssim (max-width:620px){.cms-sim .csw-main{grid-template-columns:minmax(0,1fr)}}
@container cmssim (max-width:620px){.cms-sim .csw-top .brand em{display:none}.cms-sim .csw-top{gap:8px}.cms-sim .csw-top .clock{font-size:11px}}
.cms-sim .csw table{color:var(--sim-ink);font-size:inherit}

/* ---- shared engine additions: menu tree, dictionary lists, clickable cells ---- */
.cms-sim .csw-nav button.fam{font-weight:700;color:#1d2228;padding:9px 14px}
.cms-sim .csw-nav button.fam span{color:#7a838c;font-size:12px}
.cms-sim .csw-nav button.sub{color:#2f363d}
.cms-sim .adm h4{margin:0 0 2px}
.cms-sim .adm-acd{font-size:13px;color:#4b545c;margin-bottom:10px}
.cms-sim .adm-add{display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;padding:5px 10px;border:1px solid #2f7fb5;border-radius:5px;background:#fff;color:#1f5f8c;font:13.5px Arial,Helvetica,sans-serif;cursor:pointer}
.cms-sim .adm-filter{display:block;width:100%;margin:0 0 10px;padding:9px 12px;border:1px solid #9aa5af;border-radius:6px;font:14px Arial,Helvetica,sans-serif;color:#16191d;background:#fff}
.cms-sim .adm-filter:focus-visible,.cms-sim .dlg input:focus-visible{outline:3px solid #efbf63;outline-offset:1px}
.cms-sim .adm-count{font-size:12.5px;color:#4b545c;margin:8px 0 0}
.cms-sim table.adm-t{min-width:0}
.cms-sim table.adm-t th{text-align:left;font-size:12.5px;color:#4b545c}
.cms-sim table.adm-t td{text-align:left}
.cms-sim .dlg input[type=text]{width:100%;padding:8px 10px;border:1px solid #9aa5af;border-radius:6px;font:14px Arial,Helvetica,sans-serif;background:#fff;color:#16191d}
.cms-sim table.rep td.cellpick{cursor:pointer}
.cms-sim table.rep td.cellpick:hover{outline:2px solid #efbf63;outline-offset:-2px}
.cms-sim table.rep td.c-ok{background:#d9f2e4!important;font-weight:700;outline:2px solid #2f9e6a;outline-offset:-2px}
.cms-sim table.rep td.c-no{background:#fde9ea!important}
.cms-sim table.rep th.c-ok{background:#bfe8d1!important;font-weight:700}
.cms-sim table.rep th.c-no{background:#f7d3d6!important}
.cms-sim .csw-pane h4 small{font-weight:400;color:#6b747c;font-size:12.5px;margin-left:6px}
/* vector listing */
.cms-sim .vec{font:13.5px/1.5 "Courier New",Courier,monospace;border:1px solid var(--sim-line);border-radius:6px;overflow:hidden}
.cms-sim .vec div{display:grid;grid-template-columns:38px minmax(0,1fr);gap:8px;padding:6px 10px;border-bottom:1px solid #edf0f2;cursor:pointer}
.cms-sim .vec div:last-child{border-bottom:0}
.cms-sim .vec div:hover{background:#f3f6f8}
.cms-sim .vec div b{color:#6b747c;font-weight:400}
.cms-sim .vec div.c-ok{background:#d9f2e4;box-shadow:inset 4px 0 0 #2f9e6a}
.cms-sim .vec div.c-no{background:#fde9ea}
.cms-sim .vec div.run{background:#fff4dc;box-shadow:inset 4px 0 0 #efbf63}
.cms-sim .kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:13.5px;margin:0 0 12px}
.cms-sim .kv span{color:#4b545c}
.cms-sim .two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
@container cmssim (max-width:620px){.cms-sim .two{grid-template-columns:minmax(0,1fr)}}
.cms-sim .tally{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.cms-sim .tally span{padding:4px 9px;border-radius:999px;background:#eef1f4;border:1px solid var(--sim-line);font-size:12.5px}
.cms-sim .tally span.on{background:#fff1cf;border-color:#c98a12}
.demo-one .cms-sim .csw .vec div,.demo-one .cms-sim .csw .kv span,.demo-one .cms-sim .csw .adm-count{color:#2f363d!important}
.cms-sim table.rep tr.c-ok td{background:#d9f2e4!important;font-weight:700}
.cms-sim table.rep tr.c-no td{background:#fde9ea!important}
.cms-sim .csw-top nav span.tab{cursor:pointer}
.cms-sim .csw-top nav span.tab:hover{background:#3a414a}
.cms-sim .dlg button.mini{padding:5px 10px;border:1px solid #9aa5af;border-radius:5px;background:#fff;color:#16191d;font:13px Arial,Helvetica,sans-serif;cursor:pointer;white-space:nowrap}
.cms-sim .dlg button.mini:hover{background:#f3f6f8}
.cms-sim .sim-request em{font-style:normal;color:#efbf63}
.cms-sim .csw-top .clock{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;font-variant-numeric:tabular-nums}
.cms-sim .csw-top .clock small{font-size:10px;color:#aeb8c2;letter-spacing:.02em}
.demo-one .cms-sim .csw .csw-top .clock small{color:#aeb8c2!important}
.demo-one .cms-sim .vec,.demo-one .cms-sim .vec *{font-family:"Courier New",Courier,monospace!important}
@container cmssim (max-width:1000px){.cms-sim .two{grid-template-columns:minmax(0,1fr)}.cms-sim table.rep{min-width:0}.cms-sim table.rep th{padding:6px 4px}}
.cms-sim .sim-state.s-RINGING{background:#f1c76a;color:#3d2a00}
/* phones: keep the Reports / Administration tabs usable (some exercises navigate with them) */
@container cmssim (max-width:620px){.cms-sim .csw-top .brand{display:none}.cms-sim .csw-top{padding:0 8px;gap:4px}.cms-sim .csw-top nav{display:flex}.cms-sim .csw-top nav span{padding:0 8px;font-size:12.5px}.cms-sim .csw-top .clock{font-size:10.5px}.cms-sim .csw-top .clock small{font-size:9px}}
@container cmssim (max-width:620px){.cms-sim .csw-top{flex-wrap:wrap;height:auto;padding:4px 8px;row-gap:2px}.cms-sim .csw-top nav{height:34px}.cms-sim .csw-top .clock{margin-left:auto;padding:2px 0}.cms-sim .dlg .row{padding:8px 10px}.cms-sim .dlg>div[style]{padding:6px 10px 0!important}}
.cms-sim .csw-empty,.demo-one .cms-sim.cms-sim .csw.csw .csw-empty,.demo-one .cms-sim.cms-sim .csw.csw .csw-empty *{color:#4f5860!important}
.cms-sim .ctx small,.demo-one .cms-sim.cms-sim .csw.csw .ctx small{color:#4f5860!important}