/* Additions to the mockup styles for the live site. */
body{margin:0}
.pt{font-family:var(--display);font-size:26px;margin:14px 0 6px}
h2.yr{font-family:var(--display);font-size:20px;margin:18px 0 6px}
ul.doclist{list-style:none;margin:0;padding:0}
ul.doclist li{padding:6px 0;border-bottom:1px solid var(--line)}
.result .snip a{font-weight:500}
.result mark,.snip mark{background:var(--hit);color:#000}
progress{width:140px;vertical-align:middle}
.calln{margin:10px 0}
/* Page bar: sticky while reading, so the next page is always one click away. */
.pbar{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 10px;margin:0 0 10px;background:var(--panel);border:1px solid var(--line);border-radius:6px;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.pbar .pnum{display:flex;align-items:center;gap:6px;font-weight:500}
.pbar .pnum input{width:4.2em;padding:4px 6px;font:inherit;text-align:center;border:1px solid var(--line);border-radius:4px;background:var(--bg);color:var(--fg)}
.pbar button:disabled{opacity:.45;cursor:default}
.pbar .kb{padding:0;margin-left:auto}
#pages .pagewrap{margin-bottom:18px;scroll-margin-top:70px}
#pages .pagewrap img{background:#fff}
.pglab{position:absolute;right:6px;bottom:6px;font-size:12px;background:rgba(0,0,0,.6);color:#fff;padding:2px 6px;border-radius:3px}
#pages.nosh .hlr.sh,#pages.nosh .hlr.shc{display:none}
@media (max-width:640px){.pbar .kb{display:none}}
/* Compact document header: title line, one meta line, one toolbar row. */
.dhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-top:6px}
.dhead h1{font-size:22px;margin:0}
.label.sm{font-size:12px;padding:2px 8px;margin:0}
.dmeta{font-size:13px;color:var(--muted);margin:2px 0 8px}
.dnote{border-bottom:1px dotted var(--muted);cursor:help}
.dtools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer}
.menu summary::-webkit-details-marker{display:none}
.menu .pop{position:absolute;z-index:30;top:calc(100% + 4px);left:0;min-width:300px;max-width:min(420px,90vw);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px;box-shadow:0 6px 18px rgba(0,0,0,.15);font-size:13px;display:grid;gap:6px}
.findf{display:flex;align-items:center;gap:6px;flex:1;min-width:240px}
.findf input[type=search]{flex:1;min-width:120px;padding:6px 8px;font:inherit;border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--fg)}
.findf .fz{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:3px;white-space:nowrap}
.crumb{margin-top:6px}
/* About this copy: a compact two-column list. */
.about{max-width:760px;font-size:14px}
.about dl{display:grid;grid-template-columns:150px 1fr;gap:8px 16px;margin:6px 0 10px}
.about dt{font-weight:600;color:var(--muted)}
.about dd{margin:0}
.about .tech{font-size:13px;color:var(--muted)}
.about .tech summary{cursor:pointer}
.about .tech div{display:grid;gap:4px;margin-top:6px}
.about code{font-size:11.5px;word-break:break-all}
@media (max-width:640px){.about dl{grid-template-columns:1fr;gap:2px}.about dd{margin-bottom:8px}}
/* Actions: outlined on the page images; click opens the action. */
#pages svg.acts{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#pages svg.acts polygon{fill:rgba(181,64,15,.07);stroke:var(--vote);stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linejoin:round;pointer-events:all;cursor:pointer;outline:none}
#pages svg.acts polygon:hover{fill:rgba(181,64,15,.16)}
#pages svg.acts polygon:focus-visible{stroke:var(--accent);stroke-width:4}
#pages .pmark{display:block;position:absolute;left:1%;min-width:22px;height:18px;padding:0 5px;font-size:11px;line-height:16px;border-radius:9px;border:1px solid var(--vote);background:var(--panel);color:var(--vote);text-decoration:none;text-align:center}
#pages .pmark:hover{background:var(--vote);color:#fff}
/* Highlight actions off: no outlines or tags; hovering a passage shows a blue outline. */
#pages.nohl svg.acts polygon{stroke:transparent;fill:transparent}
#pages.nohl svg.acts polygon:hover,#pages.nohl svg.acts polygon:focus-visible{stroke:color-mix(in srgb,var(--accent) 75%,transparent);fill:color-mix(in srgb,var(--accent) 14%,transparent)}
#pages.nohl .pmark{display:none}
/* Flash: yellow three times, then back to orange (shown even when "Highlight actions" is off). */
@keyframes actflash{0%,100%{stroke:var(--vote);fill:rgba(181,64,15,.07)}50%{stroke:#e0a800;fill:rgba(255,216,77,.55)}}
#pages svg.acts polygon.flash{animation:actflash .8s ease-in-out 3;stroke-width:3.5}
#pages.nohl svg.acts polygon.flash{animation:actflash .8s ease-in-out 3}
.act-li{display:flex;align-items:stretch;gap:0;padding:0;overflow:hidden}
.act-li .jump{flex:1;text-align:left;background:none;border:0;color:inherit;font:inherit;padding:7px 9px;cursor:pointer}
.act-li .jump:hover{background:var(--accent-soft)}
a.jump{display:block;text-decoration:none}
/* Full-screen page viewer */
.crop[data-view]{cursor:zoom-in}
.crop[data-view]::after{content:"⤢ Enlarge";position:absolute;right:6px;bottom:6px;font-size:11px;background:rgba(0,0,0,.6);color:#fff;padding:2px 6px;border-radius:3px}
html.lbopen,html.lbopen body{overflow:hidden}
.lb{position:fixed;inset:0;z-index:100;background:#0a1012;display:flex;flex-direction:column}
.lbbar{display:flex;align-items:center;gap:6px;padding:8px 10px;color:#fff}
.lbbar .lbt{flex:1;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lbbar button{min-width:40px;height:36px;padding:0 10px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;border-radius:6px;font:inherit;cursor:pointer}
.lbs{position:relative;flex:1;overflow:hidden;touch-action:none;cursor:grab}
.lbs:active{cursor:grabbing}
.lbc{position:absolute;left:0;top:0;transform-origin:0 0;background:#fff;will-change:transform}
.lbc img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.lbc svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.lbc polygon{fill:rgba(181,64,15,.1);stroke:#b5400f;stroke-width:3;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.lbhint{color:rgba(255,255,255,.7);font-size:12px;text-align:center;padding:6px}
.cite-m .pop{min-width:280px;user-select:text}
.cite-m #cite{font-size:13px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.actlist{max-width:520px}
.act-li .det{display:flex;align-items:center;padding:0 9px;font-size:12px;white-space:nowrap;border-left:1px solid var(--line);text-decoration:none}
.act-li.on{border-color:var(--vote)}
@media (prefers-reduced-motion:reduce){#pages svg.acts polygon.flash{animation:none;stroke:#e0a800;fill:rgba(255,216,77,.45)}}
.crop svg.cropov{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
.crop svg.cropov polygon{fill:rgba(181,64,15,.1);stroke:var(--vote);stroke-width:3;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.crop.nohl svg.cropov{display:none}
.crop .hlr{position:absolute}
a.act-li{text-decoration:none}
.chip.ok{border-color:var(--accent);color:var(--accent)}
@media (max-width:640px){.wrap{padding-left:16px;padding-right:16px}}
/* Director votes */
#dvstrip .sq{text-decoration:none}
#dvstrip .sq.dim{opacity:.25}
.sq.s-u{color:var(--accent);border-color:var(--accent)}
.sq.s-s,.sq.s-w{color:var(--muted);border-color:var(--line)}
.vt-u,.vt-s,.vt-w,.vt-x,.vt-z{color:var(--muted)}
.vt-a{color:var(--accent)}
.vt-n{color:var(--vote);font-weight:600}
footer a{color:inherit;text-decoration:underline}
.sq.s-o{color:var(--accent);border-color:var(--accent)} .vt-o{color:var(--muted)}
.lbc.nohl svg{display:none}
.lbbar .lbhl{display:flex;align-items:center;gap:5px;height:36px;padding:0 10px;border:1px solid rgba(255,255,255,.35);border-radius:6px;font-size:14px;cursor:pointer}
.lbbar .lbhl input{width:18px;height:18px}
/* Viewer toolbar on a phone: labels never wrap inside a button; the title takes its own row,
   and short labels replace long ones so the buttons fit one row. */
.lbbar{flex-wrap:wrap}
.lbbar .lbt{min-width:0}
.lbbar button,.lbbar .lbhl{flex:none;white-space:nowrap;line-height:1.2}
.lbbar .sl{display:none}
@media (max-width:560px){.lbbar .lbt{flex-basis:100%}.lbbar .ll{display:none}.lbbar .sl{display:inline}.lbbar button[data-z=fit]{margin-left:auto}.lbbar .lbx{min-width:44px;font-size:18px}}
/* Standard motion card: same fields, same order, for every motion. */
.mtitle{font-size:18px;margin:10px 0 8px;color:var(--muted);font-weight:600}
.mcard{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--vote);border-radius:8px;padding:6px 16px 10px;max-width:760px;margin-bottom:18px}
.mcard dl{margin:0}
.mrow{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:7px 0;border-bottom:1px solid var(--line)}
.mrow:last-child{border-bottom:0}
.mrow dt{font-size:13px;color:var(--muted);font-weight:600}
.mrow dd{margin:0}
.mmotion dd{font-family:var(--display);font-size:17px;line-height:1.45}
@media (max-width:640px){.mrow{grid-template-columns:1fr;gap:2px}}
.res{font-weight:600}
.res-passed{color:var(--accent)} .res-failed{color:var(--vote)} .res-withdrawn,.res-unknown{color:var(--muted)}

/* "i" info icon: hover, focus or tap to read details; Copy inside for citations. */
.ii{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:5px;border-radius:50%;border:1px solid var(--muted);color:var(--muted);font:italic 600 11px/1 Georgia,serif;cursor:pointer;vertical-align:1px}
.ii:hover,.ii:focus,.ii.open{border-color:var(--accent);color:var(--accent);outline:none}
.iitip{display:none;position:absolute;z-index:40;left:50%;top:calc(100% + 6px);transform:translateX(-50%);width:max-content;max-width:min(340px,86vw);padding:8px 10px;background:var(--panel);color:var(--fg);border:1px solid var(--line);border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.18);font:400 13px/1.45 var(--body);font-style:normal;text-align:left;cursor:auto;user-select:text}
.ii:hover .iitip,.ii:focus .iitip,.ii.open .iitip{display:block}
.iicopy{display:block;margin-top:6px;font-size:12px;padding:2px 8px}
@media (max-width:640px){.iitip{left:auto;right:-8px;transform:none}}
.mtype{font-size:13px;font-weight:500;color:var(--muted);margin-left:10px}
.dhead .label.sm{display:inline-flex;align-items:center}
/* Banner variant B (A/B test, ?banner=b): the header stays on top and shrinks to one thin line once you scroll. */
html.bb header.top{position:sticky;top:0;z-index:50;transition:box-shadow .2s}
html.bb header.top .wrap{transition:padding .2s}
html.bb.shrunk header.top{box-shadow:0 2px 8px rgba(0,0,0,.18)}
html.bb.shrunk header.top .wrap{padding-block:4px;flex-wrap:nowrap}
html.bb.shrunk .brand{font-size:15px}
html.bb.shrunk .brand small{display:none}
html.bb.shrunk header.top nav a{font-size:13px}
html.bb .pbar{top:var(--hdr,0px)}

.cov-link{font-family:var(--body);font-size:13px;font-weight:500;margin-left:10px}
table.cov tr.miss td{color:var(--vote)}
table.cov td{vertical-align:top}
