#lv{font:15px/1.5 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:transparent;
  --navy:#081e3f; --navy2:#0d2c5a; --gold:#b6862c; --gold2:#e0b64a;
  --ink:#12181f; --mut:#5b6774; --line:#dfe4ea; --card:#fff;
  --ok:#1a7f4b; --okbg:#e6f5ec; --warn:#9a6b00; --warnbg:#fdf3dd;
  --live:#c2381f; --livebg:#fdeae6; --idle:#8892a0; --zoom:#2d8cff;
}
#lv *{box-sizing:border-box}
#lv h1,#lv h2,#lv h3,#lv h4{margin:0;font-weight:700;letter-spacing:-.01em}
#lv a{color:#12508f}
#lv .wrap{max-width:1180px;margin:0 auto;padding:0 18px 60px}

/* hero -- site.css:169 has its own bare, unscoped .hero{min-height:100vh;
   display:flex;align-items:center;overflow:hidden;position:relative} for a
   totally different full-viewport landing hero elsewhere on the site. That
   rule's specificity is LOWER than #lv .hero, but CSS resolves per-property,
   not per-rule -- any property #lv .hero doesn't itself declare still comes
   from whichever OTHER matching rule sets it, regardless of specificity. This
   rule must therefore explicitly counter every property site.css's .hero sets
   that isn't wanted here, not just add its own on top (SEQ 34.1, measured live:
   a full-viewport blank navy void above all real content). */
/* SEQ 38 P2: this hero's own top padding was 22px -- nowhere near enough to
   clear nav.site's fixed 64px header (site.css:49, position:fixed), which the
   template never accounts for because live_event.html's hero uses .inner, not
   .wrap -- site.css's own rule for .hero .wrap (top padding 96px, the value
   every OTHER page's hero relies on for exactly this) never matches here.
   Masoud saw the "VIRTUAL SHOWCASE" title rendering clipped behind the nav
   bar; 96px matches the site's own established clearance instead of
   inventing a new number. */
#lv .hero{background:linear-gradient(180deg,var(--navy2),#123064);color:#fff;padding:96px 0 0;border-radius:0 0 12px 12px;
  min-height:0;display:block;align-items:unset;overflow:visible;position:static}
#lv .hero .inner{max-width:1180px;margin:0 auto;padding:0 18px}
#lv .hero h1{font-size:26px}
#lv .hero .sub{color:#b9cbe6;font-size:14px;margin-top:4px}
#lv .herorow{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap}
#lv .statuschip{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:7px 15px;font-weight:700;font-size:14px}
#lv .st-before{background:#e8f0fb;color:#123f7d}
#lv .st-live{background:var(--live);color:#fff}
#lv .st-after{background:#dfe4ea;color:#3c4652}

/* timeline rail -- the only time-varying element besides the chip */
/* SEQ 38 P1b: sticky while scrolling (site.css's nav.site is a fixed 64px
   header -- top matches that clearance, same value #lv .hero's own P2 fix
   uses, and z-index sits below the nav's own 50 so the nav still wins). */
#lv .rail{background:#fff;border-radius:12px 12px 0 0;margin-top:18px;padding:16px 18px 6px;
  position:sticky;top:64px;z-index:40;box-shadow:0 6px 18px -8px rgba(8,30,63,.18)}
/* SEQ 38 P1b: a slim, smoothly-animating fill under the stops row -- % of
   the current round elapsed. Empty/invisible (0 width) whenever no round is
   live, per the standing before/during/after rule (nothing to animate before
   or after the event). */
#lv .railbar{height:4px;border-radius:99px;background:var(--line);margin:2px 0 10px;overflow:hidden}
#lv .railbar .f{height:100%;width:0;background:var(--live);transition:width 1s linear}
#lv .railhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;flex-wrap:wrap;gap:8px}
#lv .railhead h3{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut)}
#lv .railnow{font-size:13px;font-weight:700;color:var(--live)}
#lv .stops{display:flex;position:relative;padding-bottom:6px}
#lv .stop{flex:1;min-width:0;text-align:center;position:relative;padding-top:26px}
#lv .stop:before{content:"";position:absolute;top:9px;left:0;right:0;height:4px;background:var(--line)}
#lv .stop:first-child:before{left:50%}
#lv .stop:last-child:before{right:50%}
#lv .stop .pip{position:absolute;top:3px;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;background:#fff;border:4px solid var(--line);z-index:2}
#lv .stop.done:before{background:var(--gold)}
#lv .stop.done .pip{border-color:var(--gold);background:var(--gold)}
#lv .stop.now .pip{border-color:var(--live);background:var(--live);animation:lvpulse 1.6s infinite}
@keyframes lvpulse{0%,100%{box-shadow:0 0 0 5px var(--livebg)}50%{box-shadow:0 0 0 10px var(--livebg)}}
#lv .stop .t{font-size:12px;font-weight:700}
#lv .stop .l{font-size:11px;color:var(--mut);line-height:1.3}
#lv .stop.now .t{color:var(--live)}
#lv .stop.pend .t,#lv .stop.pend .l{color:var(--idle)}
#lv .stop .mine{display:block;margin-top:4px;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);background:#fdf6e6;border-radius:4px;padding:2px 3px}
#lv .stop.now .mine{color:#fff;background:var(--live)}
#lv .railfoot{border-top:1px solid var(--line);margin-top:8px;padding:10px 0 6px;font-size:13px;color:var(--mut);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* layout */
#lv .cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;margin-top:18px;align-items:start}
@media(max-width:900px){#lv .cols{grid-template-columns:minmax(0,1fr)}}
/* site.css:255 has its own unscoped .card (a totally different dark/glass
   component card used elsewhere) with its own padding+display:flex. Same
   per-property leak risk as .hero above -- explicit resets, not just additions. */
#lv .card{background:var(--card);border:1px solid var(--line);border-radius:11px;margin-bottom:14px;overflow:hidden;
  padding:0;display:block}
/* site.css:264 .card h3 sets color:var(--fg-dark) (the light-on-dark-shell ink,
   #EDF1F7) plus its own font-size/margin-bottom -- SEQ 34.1's reported invisible
   card titles. Explicit color (and the other properties that rule sets) needed,
   not assumed beaten by #lv's own higher-specificity #lv .card>h3 selector,
   since specificity only decides a conflict when both rules touch the SAME
   property, and the original rule below never set color at all. */
#lv .card>h3{padding:13px 16px;border-bottom:1px solid var(--line);font-size:14px;background:#fafbfc;display:flex;justify-content:space-between;align-items:center;gap:10px;
  color:var(--ink);margin:0;text-transform:none;letter-spacing:normal}
#lv .card .body{padding:16px}
#lv .card .body.tight{padding:0}
#lv .muted{color:var(--mut)} #lv .small{font-size:13px} #lv .xs{font-size:12px}
#lv .pill{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}
#lv .p-ok{background:var(--okbg);color:var(--ok)} #lv .p-w{background:var(--warnbg);color:var(--warn)}
#lv .p-live{background:var(--livebg);color:var(--live)} #lv .p-n{background:#eef1f5;color:#55606d}
/* v3.7 Delta 1/2 -- Cap 1 peer-eval note + admin-only room-board note reuse this;
   Delta 2's per-room headcount reuses .occ. Both #lv-scoped, both additive. */
#lv .rolenote{background:#eef4fb;border:1px solid #cfdcee;color:#1d3d66;border-radius:9px;padding:10px 12px;font-size:12.5px;line-height:1.45;margin:0 0 12px}
#lv .rolenote code{background:#dde8f6;border-radius:4px;padding:1px 5px;font-size:11.5px}
#lv .occ{font-size:11.5px;color:#1d3d66;background:#eef4fb;border:1px solid #cfdcee;border-radius:7px;padding:4px 8px;margin-top:5px;display:inline-block}
/* site.css:159 has its own unscoped .btn (uppercase, letter-spaced hero CTAs) --
   the font shorthand below already resets weight/size/line-height, but
   text-transform/letter-spacing aren't part of that shorthand and would
   otherwise leak (every button on this page would render UPPERCASE). */
#lv .btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 13px;font:600 13px/1 inherit;color:var(--ink);cursor:pointer;text-decoration:none;
  text-transform:none;letter-spacing:normal}
#lv .btn:hover{background:#f6f8fa}
#lv .btn.pri{background:var(--navy);border-color:var(--navy);color:#fff}
#lv .btn.zoom{background:var(--zoom);border-color:var(--zoom);color:#fff;font-size:14px;padding:10px 16px}
#lv .btn.gold{background:var(--gold);border-color:var(--gold);color:#1a1206}
#lv .btn.sm{padding:6px 10px;font-size:12px}
#lv .btn.xs{padding:4px 9px;font-size:11.5px}
#lv .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* project row (one component, reused everywhere) */
#lv .asg{border-bottom:1px solid var(--line)}
#lv .asg:last-child{border-bottom:0}
#lv .asghead{display:flex;gap:14px;align-items:flex-start;padding:13px 16px;cursor:pointer}
#lv .asghead:hover{background:#fafbfc}
#lv .asg.open .asghead{background:#f7f9fb}
#lv .rnd{flex:0 0 76px;text-align:center;border-right:1px solid var(--line);padding-right:12px}
#lv .rnd .n{font-weight:800;font-size:13px} #lv .rnd .tm{font-size:11px;color:var(--mut)}
#lv .asgmain{flex:1;min-width:0}
#lv .asgmain .ttl{font-weight:700;font-size:15px}
#lv .asgmain .meta{font-size:12px;color:var(--mut);margin-top:2px}
#lv .joinmini{flex:0 0 auto}
#lv .chev{color:var(--mut);font-size:13px;align-self:center}
#lv .asgbody{padding:2px 16px 18px 106px;display:none}
@media(max-width:700px){#lv .asgbody{padding-left:16px}}
/* v3.7 Delta 3 -- the collapsed-row Join button must be reachable on a phone
   without opening the card; unconditional across every role/room. */
@media(max-width:700px){#lv .asghead{flex-wrap:wrap}#lv .chev{order:3}#lv .joinmini{order:4;flex:1 1 100%;margin-top:4px}#lv .joinmini .btn{width:100%;justify-content:center}}
#lv .asg.open .asgbody{display:block}
/* site.css:239 has its own unscoped .sec (page-section spacer, padding:92px 0
   40px) -- would otherwise inflate every "Abstract"/"Team"/"Project materials"
   sub-section inside a room card by ~90px of unwanted vertical padding. */
#lv .sec{margin-top:16px;padding:0}
#lv .sec>h4{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--mut);margin-bottom:7px}
#lv .abs{font-size:13.5px}
#lv .abs .lead{font-weight:600;margin-bottom:7px}
#lv .more{color:#12508f;cursor:pointer;font-weight:600;font-size:12.5px}
#lv .people{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:7px;font-size:13px}
#lv .pe{border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fcfdfe}
#lv .pe .nm{font-weight:600}
#lv .pe .rl{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.04em}
#lv .pe.lead{border-color:var(--gold);background:#fdfaf2}
#lv .pe.staff{background:#f6f9fd;border-color:#cfe0f3}

/* artifact tray */
#lv .tray{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
@media(max-width:800px){#lv .tray{grid-template-columns:repeat(2,1fr)}}
#lv .tile{border:1px solid var(--line);border-radius:9px;padding:11px 8px;text-align:center;background:#fff}
#lv .tile.can{cursor:pointer}
#lv .tile.can:hover{border-color:var(--navy);background:#f7fafd}
#lv .tile .ti{font-size:18px;line-height:1}
#lv .tile .tn{font-weight:700;font-size:12px;margin-top:5px}
#lv .tile .ts{font-size:11.5px;color:#3c4652;margin-top:3px}
#lv .tile .ts.go{color:#12508f;font-weight:700}
#lv .tile .tx{font-size:10.5px;color:var(--mut);margin-top:2px}
#lv .tile.empty{background:repeating-linear-gradient(135deg,#fafbfc,#fafbfc 7px,#f2f4f7 7px,#f2f4f7 14px);border-style:dashed}
#lv .tile.empty .ti,#lv .tile.empty .tn{opacity:.4}
#lv .tile.empty .ts{color:var(--warn);font-weight:700;font-size:11px}
#lv .viewer{border:1px solid var(--line);border-radius:9px;background:#f6f7f9;min-height:280px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:var(--mut);font-size:12.5px;margin-top:10px;padding:16px}
#lv .viewer .pg{width:190px;height:210px;background:#fff;border:1px solid var(--line);box-shadow:0 2px 8px rgba(0,0,0,.07);display:flex;align-items:center;justify-content:center;font-size:12px;color:#98a2b0;text-align:center;padding:10px}
#lv .viewer .vid{width:340px;max-width:100%;aspect-ratio:16/9;background:#111;color:#fff;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:26px}
/* SEQ 38 A2: a real inline PDF viewer -- a document is portrait/tall, not
   16:9 like .vid, and not a small fixed placeholder like .pg. */
#lv .viewer .doc{width:100%;height:70vh;min-height:420px;background:#fff;border:1px solid var(--line);border-radius:7px}

/* evaluation form */
#lv .form{border:1px solid var(--line);border-radius:9px;padding:14px;background:#fcfdfe;margin-top:10px}
#lv .dim{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-bottom:1px dashed var(--line);font-size:14px}
#lv .dim:last-of-type{border-bottom:0}
#lv .stars{color:#d8dde3;font-size:19px;letter-spacing:2px;cursor:pointer;user-select:none}
#lv .stars .on{color:var(--gold2)}
#lv .so{border:1px solid var(--line);border-radius:8px;margin-bottom:8px;background:#fff}
#lv .so>.sh{padding:9px 11px;border-bottom:1px solid var(--line);background:#f8fafc;border-radius:8px 8px 0 0}
#lv .so .sn{font-weight:800;font-size:12px;color:var(--navy);letter-spacing:.04em}
#lv .so .st{font-size:12.5px;color:#3c4652;margin-top:2px}
#lv .so.d6>.sh{background:#fdf8ec}
#lv .so .si{padding:9px 11px;display:grid;grid-template-columns:1fr 1fr;gap:5px;font-size:12.5px}
@media(max-width:700px){#lv .so .si{grid-template-columns:1fr}}
#lv .so .si label{display:flex;gap:7px;align-items:flex-start;color:#3c4652}
#lv textarea{width:100%;border:1px solid var(--line);border-radius:7px;padding:9px;font:inherit;font-size:13px;min-height:64px;resize:vertical}
#lv input[type=text]{width:100%;border:1px solid var(--line);border-radius:7px;padding:8px 9px;font:inherit;font-size:13px}
#lv .savebar{display:flex;justify-content:space-between;align-items:center;margin-top:12px;gap:10px;flex-wrap:wrap}

#lv .lst{list-style:none;margin:0;padding:0}
#lv .lst li{padding:10px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:13.5px}
#lv .lst li:last-child{border-bottom:0}
#lv .lst li.now{background:var(--livebg)}
/* site.css:334 has its own unscoped .kv (margin-top:26px;max-width:75ch) --
   not rendered by anything yet (reserved for a later part), fixed defensively
   now rather than left as a latent trap for whenever it is wired in. */
#lv .kv{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--line);gap:10px;margin-top:0;max-width:none}
#lv .kv:last-child{border-bottom:0}
#lv .note{background:#f3f7fd;border-left:3px solid #7ba6dd;padding:10px 12px;border-radius:0 7px 7px 0;font-size:12.5px;color:#254a77}
#lv .alwayson{background:#eef7f0;border-left:3px solid #5aa877;color:#1c5636}
#lv .hide{display:none!important}
#lv .filt{display:flex;gap:6px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line);background:#fafbfc;align-items:center}

/* filters */
#lv .filt .srch{flex:1;min-width:220px}
#lv .filt .chk{display:inline-flex;gap:7px;align-items:center;font-size:12.5px;border:1px solid var(--line);border-radius:7px;padding:6px 10px;background:#fff;cursor:pointer;user-select:none}
#lv .filt .chk.on{border-color:var(--navy);background:#eef3fa;font-weight:600}
#lv select{border:1px solid var(--line);border-radius:7px;padding:8px 9px;font:inherit;font-size:13px;background:#fff}
/* messages */
#lv .thr{border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:9px;background:#fff}
#lv .thr>.th{padding:8px 11px;background:#f8fafc;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:12.5px}
#lv .who2{font-weight:700}
#lv .msg{padding:9px 11px;border-bottom:1px dashed var(--line);font-size:13px;color:#2b3541}
#lv .msg:last-child{border-bottom:0}
#lv .msg .mh{font-size:11px;color:var(--mut);margin-bottom:3px}
#lv .msg.me{background:#f7fafd}
#lv .msg.blast{background:#fdf8ec}
/* outcome block variants */
#lv .so.d5>.sh{background:#f4f1fb}
#lv .so.d3>.sh{background:#eef6f1}

/* SEQ 51.1 -- the collapsed-state help-desk alarm badge, in the card's own
   h3 so it stays visible while the card is collapsed. */
#lv .hbadge{font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px;white-space:nowrap;margin-left:6px}
#lv .hbadge:empty{display:none;margin-left:0;padding:0}
#lv .hb-new{background:var(--livebg);color:var(--live)}
#lv .hb-wait{background:var(--warnbg);color:var(--warn)}
#lv .hb-new.pulse{animation:lvpulse 0.45s ease-out 2}
#lv .thr.thrnew{border-left:3px solid var(--live)}
#lv .newchip{display:inline-block;background:var(--live);color:#fff;font-size:10px;font-weight:700;letter-spacing:.03em;border-radius:4px;padding:1px 5px;margin-left:5px;vertical-align:middle}
#lv .thr.thrcollapsed{cursor:pointer}
#lv .thr.thrcollapsed:hover{background:#f8fafc}
#lv .thr.thrcollapsed>.th{border-bottom:0}

/* collapse affordance */
#lv .card.col>h3{cursor:pointer;user-select:none}
#lv .card.col>h3:hover{background:#f1f5f9}
#lv .cchev{margin-left:auto;flex:0 0 auto;width:23px;height:23px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--mut);font-size:12px;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s ease}
#lv .card.col>h3:hover .cchev{border-color:var(--navy);color:var(--navy)}
#lv .card.closed>h3 .cchev{transform:rotate(-90deg)}
#lv .card.closed>h3{border-bottom:0}
#lv .card.closed>*:not(h3){display:none}
#lv .chev{display:flex;align-items:center;gap:7px;align-self:center;color:var(--mut);font-size:11.5px;font-weight:700}
#lv .chev .cb{width:23px;height:23px;border:1px solid var(--line);border-radius:999px;background:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:400;transition:transform .15s ease}
#lv .asghead:hover .chev .cb{border-color:var(--navy);color:var(--navy)}
#lv .asg.open .chev .cb{transform:rotate(180deg);border-color:var(--navy);color:var(--navy)}
#lv .chev .lc{display:none}
#lv .asg.open .chev .lo{display:none}
#lv .asg.open .chev .lc{display:inline}
#lv .peek{font-size:11.5px;color:var(--mut);margin-top:4px}
#lv .asg.open .peek{display:none}
@media(max-width:700px){#lv .chev .lo,#lv .chev .lc{display:none}}
/* live counts */
#lv .cnt2{width:100%;border-collapse:collapse;font-size:13px}
#lv .cnt2 th{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:700;text-align:right;padding:0 0 7px;border-bottom:1px solid var(--line)}
#lv .cnt2 th:first-child{text-align:left}
#lv .cnt2 td{padding:8px 0;border-bottom:1px solid var(--line);text-align:right}
#lv .cnt2 td:first-child{text-align:left}
#lv .cnt2 tr:last-child td{border-bottom:0}
#lv .cnt2 .lv{font-weight:800;font-size:15px}

/* Outcome 5 team assessment + multi-select audience picker */
#lv .reqbar{background:linear-gradient(90deg,#fff6e0,#fffdf8);border:1px solid #e6cf8f;border-left:5px solid var(--gold);border-radius:11px;padding:13px 16px;margin-bottom:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13.5px}
#lv .reqbar b{color:#6b5008}
#lv .card.req>h3{background:#fffaf0;border-bottom-color:#e6cf8f}
#lv .tgwrap{overflow-x:auto;min-width:0;-webkit-overflow-scrolling:touch}
#lv .tg{width:100%;min-width:520px;border-collapse:collapse;font-size:13px}
#lv .tg th{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);text-align:center;padding:0 0 8px;border-bottom:1px solid var(--line);font-weight:700}
#lv .tg th:first-child{text-align:left}
#lv .tg td{padding:10px 0;border-bottom:1px solid var(--line);vertical-align:middle}
#lv .tg td:first-child{padding-right:16px}
#lv .tg tr:last-child td{border-bottom:0}
#lv .tg td.c{text-align:center;width:190px}
#lv .rt{display:inline-flex;gap:4px}
#lv .rt i{font-style:normal;width:27px;height:27px;border:1px solid var(--line);border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;cursor:pointer;background:#fff;color:var(--mut);user-select:none}
#lv .rt i:hover{border-color:var(--navy);color:var(--navy)}
#lv .rt i.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700}
#lv .tmr{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
#lv .tmr:last-child{border-bottom:0}
#lv .tmr .nm{font-weight:700;font-size:13px;min-width:160px}
#lv .tmr input[type=text]{flex:1;min-width:190px}
#lv .tmstat{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
#lv .tmstat span{font-size:11.5px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;background:#fff}
#lv .tmstat span.y{background:var(--okbg);border-color:#bfe3cd;color:var(--ok);font-weight:600}
#lv .tmstat span.n{background:var(--warnbg);border-color:#e8d6a4;color:var(--warn);font-weight:600}
#lv .qh{font-weight:700;font-size:13px;margin:18px 0 8px;padding-top:14px;border-top:1px solid var(--line)}
#lv .qh:first-child{border-top:0;padding-top:0;margin-top:0}
#lv .pk{position:relative}
#lv .pk input[type=text]{width:100%}
#lv .pkres{position:static;margin-top:7px;max-height:236px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:0 12px 26px rgba(16,32,54,.16)}
#lv .pkres .it{padding:8px 11px;cursor:pointer;border-bottom:1px solid var(--line);font-size:13px}
#lv .pkres .it:last-child{border-bottom:0}
#lv .pkres .it:hover{background:#eef3fa}
#lv .pkres .it .s{font-size:11px;color:var(--mut);margin-top:1px}
#lv .pkres .none{padding:13px;font-size:12.5px;color:var(--mut)}
#lv .chosen{display:inline-flex;align-items:center;gap:8px;background:#eef3fa;border:1px solid var(--navy);border-radius:999px;padding:4px 12px;font-size:12.5px;font-weight:700}
#lv .chosen .x{cursor:pointer;color:var(--mut);font-weight:400}
/* site.css:247 has its own unscoped .chips (justify-content:center;margin-bottom:
   34px, the home-page discipline-filter row) -- not rendered by anything yet
   (admin audience picker, reserved for the Part F frontend), fixed defensively. */
#lv .chips{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-start;margin-bottom:0}
#lv .pkres .it.on{background:#f2f8f4}
#lv .pkres .it .tick{font-size:10.5px;color:var(--ok);font-weight:700;margin-left:6px}
#lv .pkclr{font-size:11.5px;color:#12508f;font-weight:700;cursor:pointer;margin-left:4px}
/* SEQ 42 Part 1: two distinct affordances (Open + Download) per artifact now,
   not one -- .tlinks is the divider/spacing wrapper so two links sit side by
   side under one rule instead of stacking two dashed dividers. */
#lv .tlinks{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;margin-top:7px;padding-top:6px;border-top:1px dashed var(--line)}
#lv .tlink{font-size:11px;font-weight:700;color:#12508f;text-decoration:none}
#lv .tlink:hover{text-decoration:underline}
/* SEQ 42 Part 1: three buttons possible now (Open/Download/Close, up from
   two) -- wrap rather than overflow on a narrow phone. */
#lv .viewer .vwbar{display:flex;align-items:center;gap:8px;width:100%;font-size:13px;color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:9px;flex-wrap:wrap}
#lv .viewer .vwbar .grow{flex:1}

/* minimal local toast -- public_base.html never loads the portal SPA's own
   alertModal/toast, so this page needs its own tiny equivalent (see lvToast()). */
#lv .lvtoast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);
  background:var(--navy);color:#fff;padding:10px 18px;border-radius:999px;font-size:13.5px;
  font-weight:600;box-shadow:0 8px 24px rgba(8,30,63,.28);opacity:0;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;z-index:60;max-width:88vw;text-align:center}
#lv .lvtoast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* mobile: real-device fixes (Addendum 4). Nav-toggle rules from the mockup's
   equivalent media query are DELIBERATELY excluded -- the real site's own
   #navtoggle in public_base.html already handles this; porting the mockup's
   version would produce two competing hamburgers. */
@media(max-width:700px){
  #lv input[type=text],#lv textarea,#lv select{font-size:16px}
  #lv .btn{min-height:44px}
  #lv .btn.sm{padding:9px 12px;font-size:13px;min-height:44px}
  #lv .more{display:inline-block;padding:12px 0;font-size:13.5px}
  #lv .tlink{padding-top:14px;padding-bottom:12px;font-size:12.5px}
  #lv .srch{padding:11px 10px}
  #lv label.chk{min-height:44px;align-items:center}
  #lv select{min-height:44px;padding:10px 9px}
  #lv input[type=text],#lv textarea{padding:11px 10px}
  #lv .so .si{gap:0}
  #lv .so .si label{min-height:44px;align-items:center;padding:6px 0;gap:10px}
  #lv .so .si label input{width:19px;height:19px;flex:0 0 auto}
  /* SEQ 38 P1b: six stops at 700px still fit, but "Rehearsal Round N"/full
     12h times crowd badly -- shrink type and drop the sticky rail (a sticky
     header eats too much of a phone's viewport permanently). */
  #lv .rail{position:static;box-shadow:none;padding:14px 14px 4px}
  #lv .stop .t{font-size:10.5px}
  #lv .stop .l{font-size:9.5px}
  #lv .railhead h3{font-size:11.5px}
  #lv .railnow{font-size:12px}
}
@media(max-width:620px){
  #lv .tgwrap{overflow-x:visible}
  #lv .tg{min-width:0;font-size:13.5px}
  #lv .tg thead{display:none}
  #lv .tg,#lv .tg tbody,#lv .tg tr,#lv .tg td{display:block;width:auto}
  #lv .tg tr{padding:13px 0;border-bottom:1px solid var(--line)}
  #lv .tg tr:last-child{border-bottom:0}
  #lv .tg td{border-bottom:0;padding:0}
  #lv .tg td:first-child{padding:0 0 10px;font-weight:600}
  #lv .tg td.c{text-align:left;width:auto;display:block;padding:4px 0 9px}
  #lv .tg td.c::before{content:attr(data-l);display:block;margin-bottom:6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:700}
  #lv .rt{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%;max-width:320px}
  #lv .rt i{width:auto;height:44px;font-size:14.5px;border-radius:9px}
  #lv .tmr{gap:6px}
  #lv .tmr .nm{min-width:0;width:100%}
  #lv .tmr input[type=text]{min-width:0;flex:1 1 100%;width:100%}
}