/* CCRB reticle — cursor, acquired-card styling, and the Motion setting. The reticle parts sit directly on as position:fixed elements. No wrapper and no overflow, so nothing can clip or mis-size them. */ /* ---------- hide the real cursor everywhere, including the settings panel ---------- */ html.rt-on,html.rt-on *{cursor:none !important} html[data-reticle-mode="touch"],html[data-reticle-mode="touch"] *, html[data-reticle-mode="off"],html[data-reticle-mode="off"] *{cursor:auto} html[data-reticle-mode="off"] .rt-frame,html[data-reticle-mode="off"] .rt-readout, html[data-reticle-mode="touch"] .rt-frame,html[data-reticle-mode="touch"] .rt-readout{display:none} /* ---------- the frame ---------- */ .rt-frame{position:fixed;top:0;left:0;width:40px;height:40px; pointer-events:none;z-index:2147483600;color:var(--vfd,#5ff2d0); will-change:transform,width,height;opacity:0} .rt-frame.rt-locked{color:var(--rt-accent,#ff9638)} .rt-frame > b{position:absolute;width:12px;height:12px;border:0 solid currentColor; box-shadow:none;display:block} .rt-frame > b:nth-of-type(1){border-top-width:2px;border-left-width:2px} .rt-frame > b:nth-of-type(2){border-top-width:2px;border-right-width:2px} .rt-frame > b:nth-of-type(3){border-bottom-width:2px;border-left-width:2px} .rt-frame > b:nth-of-type(4){border-bottom-width:2px;border-right-width:2px} .rt-frame.rt-locked > b{display:none} .rt-frame.rt-locked{border:1.5px solid currentColor;border-radius:var(--rt-radius,2px); box-shadow:0 0 0 1px rgba(8,11,17,.6),0 0 14px -2px currentColor} .rt-frame > b:nth-of-type(1){left:0;top:0} .rt-frame > b:nth-of-type(2){right:0;top:0} .rt-frame > b:nth-of-type(3){left:0;bottom:0} .rt-frame > b:nth-of-type(4){right:0;bottom:0} .rt-frame .rt-dot{position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px; border-radius:50%;background:currentColor} .rt-frame.rt-k-card .rt-dot,.rt-frame.rt-k-chip .rt-dot, .rt-frame.rt-k-link .rt-dot,.rt-frame.rt-k-search .rt-dot{display:none} .rt-frame .rt-ring{position:absolute;left:-6px;top:-6px;right:-6px;bottom:-6px; border:1px solid currentColor;border-radius:calc(var(--rt-radius,2px) + 5px);opacity:0;transition:opacity 140ms cubic-bezier(.2,.7,.3,1)} .rt-frame.rt-locked .rt-ring{opacity:.3} .rt-frame .rt-pulse{position:absolute;left:-6px;top:-6px;right:-6px;bottom:-6px; border:1.5px solid var(--rt-accent,#ff9638);opacity:0} .rt-frame.rt-click .rt-pulse{animation:rt-pulse 350ms cubic-bezier(.2,.7,.3,1)} @keyframes rt-pulse{from{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.5)}} html[data-reticle-mode="reduced"] .rt-frame .rt-pulse{animation:none !important} /* shapes */ .rt-frame.rt-k-chip > b{display:none} .rt-frame.rt-k-link > b:nth-of-type(1),.rt-frame.rt-k-link > b:nth-of-type(2){display:none} .rt-frame.rt-k-link > b:nth-of-type(3),.rt-frame.rt-k-link > b:nth-of-type(4){width:7px;height:7px;box-shadow:none} .rt-frame.rt-k-link.rt-locked > b:nth-of-type(3),.rt-frame.rt-k-link.rt-locked > b:nth-of-type(4){display:block} .rt-frame.rt-k-link.rt-locked{border:0;box-shadow:none} .rt-frame.rt-k-link::after{content:"";position:absolute;left:6px;right:6px;bottom:0;height:1.5px; background:currentColor;box-shadow:0 0 6px currentColor;transform-origin:left; animation:rt-underline 260ms cubic-bezier(.2,.7,.3,1) both} @keyframes rt-underline{from{transform:scaleX(0)}to{transform:scaleX(1)}} html[data-reticle-mode="reduced"] .rt-frame.rt-k-link::after{animation:none} .rt-frame.rt-k-search > b:nth-of-type(2),.rt-frame.rt-k-search > b:nth-of-type(4){display:none} .rt-frame.rt-k-search.rt-locked > b:nth-of-type(1),.rt-frame.rt-k-search.rt-locked > b:nth-of-type(3){display:block} .rt-frame.rt-k-search.rt-locked{border:0;box-shadow:none} .rt-frame.rt-k-search::after{content:"";position:absolute;left:0;top:0;bottom:0;width:1.5px; background:currentColor;box-shadow:0 0 6px currentColor} .rt-frame.rt-k-search::before{content:"";position:absolute;left:14px;top:26%;bottom:26%;width:1px; background:currentColor;animation:rt-caret 1.1s steps(1) infinite} @keyframes rt-caret{0%,50%{opacity:1}51%,100%{opacity:0}} html[data-reticle-mode="reduced"] .rt-frame.rt-k-search::before{animation:none} /* ---------- readout ---------- */ .rt-readout{position:fixed;top:0;left:0;pointer-events:none;opacity:0;z-index:2147483500; font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;letter-spacing:.08em; line-height:1.5;color:var(--ink-faint,#96a3b2);white-space:nowrap; background:var(--bg-1,#0e131b);border:1px solid var(--line-mid,#2a3646); border-left:2px solid var(--rt-accent,#ff9638);padding:6px 9px; box-shadow:0 10px 24px -10px rgba(0,0,0,.9); transition:opacity 140ms cubic-bezier(.2,.7,.3,1);will-change:transform,opacity} .rt-readout.on{opacity:1} .rt-readout span{display:block} .rt-readout .t{color:var(--vfd,#5ff2d0);font-size:13px;letter-spacing:.06em} .rt-readout .sev{font-size:10px} html[data-reticle-mode="reduced"] .rt-readout{transition:none} html:not([data-reticle-mode="reduced"]) .rt-readout.on span{animation:rt-type 260ms cubic-bezier(.2,.7,.3,1) both} html:not([data-reticle-mode="reduced"]) .rt-readout.on span:nth-child(2){animation-delay:90ms} html:not([data-reticle-mode="reduced"]) .rt-readout.on span:nth-child(3){animation-delay:180ms} @keyframes rt-type{from{clip-path:inset(0 100% 0 0);opacity:.4}to{clip-path:inset(0 0 0 0);opacity:1}} .rt-readout.right::before,.rt-readout.left::before{content:"";position:absolute;top:12px;width:10px;height:1px; background:var(--rt-accent,#ff9638);opacity:.7} .rt-readout.right::before{left:-12px} .rt-readout.left::before{right:-12px} .rt-readout.inside{background:rgba(8,11,17,.94)} /* ---------- acquired target ---------- */ [data-reticle="card"]{transition:transform 180ms cubic-bezier(.2,.7,.3,1),box-shadow 180ms cubic-bezier(.2,.7,.3,1)} [data-reticle="card"].rt-acquired{transform:translateY(-6px) scale(1.03); box-shadow:0 14px 28px -12px rgba(0,0,0,.85),0 0 22px -4px var(--rt-sev,transparent)} [data-reticle="card"][data-rec-tier="1"]{--rt-sev:rgba(74,168,99,.7)} [data-reticle="card"][data-rec-tier="2"]{--rt-sev:rgba(220,148,18,.7)} [data-reticle="card"][data-rec-tier="3"]{--rt-sev:rgba(207,74,62,.8)} html[data-reticle-mode="reduced"] [data-reticle="card"]{transition:none} html[data-reticle-mode="reduced"] [data-reticle="card"].rt-acquired{transform:none} html[data-reticle-mode="touch"] [data-reticle].rt-acquired{outline:1.5px solid var(--rt-accent,#ff9638);outline-offset:5px} html[data-reticle-mode="off"] [data-reticle="card"]{transition:none} html[data-reticle-mode="off"] [data-reticle="card"].rt-acquired{transform:none;box-shadow:none} /* ---------- Settings: masthead menu ---------- */ .rt-set{position:relative;display:inline-block} .rt-set-btn{background:none;border:1px solid var(--line-mid);color:var(--ink-faint); font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .55rem;cursor:pointer} .rt-set-btn svg{vertical-align:-1px;margin-right:4px} .rt-set-btn:hover,.rt-set-btn[aria-expanded="true"]{border-color:var(--rt-accent,#ff9638);color:var(--rt-accent,#ff9638)} .rt-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:2147483400;min-width:230px; background:var(--bg-1,#0e131b);border:1px solid var(--line-mid);box-shadow:0 14px 34px -12px rgba(0,0,0,.9);padding:5px} .rt-menu[hidden]{display:none} .rt-menu-h{font-family:var(--font-display,var(--font-mono));font-size:11px;letter-spacing:.14em;text-transform:uppercase; color:var(--ink,#f6f8fb);text-align:center;padding:9px 10px 8px;border-bottom:1px solid var(--line-mid);margin-bottom:5px} .rt-menu-i{display:block;width:100%;text-align:left;background:var(--bg-2,#151c26);border:1px solid var(--line); padding:9px 12px;margin-bottom:5px;cursor:pointer;border-radius:2px} .rt-menu-i:last-child{margin-bottom:0} .rt-menu-i:hover,.rt-menu-i:focus-visible{border-color:var(--rt-accent,#ff9638);outline:none} .rt-menu-n{display:block;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--ink,#f6f8fb)} .rt-menu-d{display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;color:var(--ink-faint);margin-top:2px} @media (max-width:640px){.rt-menu{right:auto;left:0}} /* ---------- Settings: dialog ---------- */ .rt-dlg-bg{position:fixed;inset:0;background:rgba(4,6,10,.82);z-index:2147483500;display:grid;place-items:center;padding:1rem} body.print .rt-dlg-bg{background:rgba(120,116,105,.55)} .rt-dlg{width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column; background:var(--bg-1,#0e131b);border:1px solid var(--line-hi,var(--line-mid));box-shadow:0 30px 70px -20px rgba(0,0,0,.95)} .rt-dlg-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line-mid)} .rt-dlg-title{font-family:var(--font-display,var(--font-mono));font-size:12px;letter-spacing:.14em;color:var(--ink,#f6f8fb)} .rt-dlg-title i{font-style:normal;color:var(--rt-accent,#ff9638)} .rt-dlg-x{background:none;border:1px solid var(--line-mid);color:var(--ink-dim);width:28px;height:28px;font-size:16px;line-height:1;cursor:pointer} .rt-dlg-x:hover{border-color:var(--rt-accent,#ff9638);color:var(--rt-accent,#ff9638)} .rt-dlg-body{padding:12px 14px;overflow-y:auto} .rt-dlg-h{font-family:var(--font-display,var(--font-mono));font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint); padding-bottom:6px;margin:6px 0 10px;border-bottom:1px solid var(--line)} .rt-dlg-h:first-child{margin-top:0} .rt-dlg-grid{display:grid;grid-template-columns:1fr;gap:6px;margin-bottom:6px} .rt-dlg-c{display:block;text-align:left;background:var(--bg-2,#151c26);border:1px solid var(--line);border-left:3px solid transparent; padding:9px 12px;cursor:pointer;border-radius:2px} .rt-dlg-c:hover{border-color:var(--line-mid)} .rt-dlg-c.on{border-color:var(--rt-accent,#ff9638);border-left-color:var(--rt-accent,#ff9638)} .rt-dlg-cn{display:block;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--ink,#f6f8fb)} .rt-dlg-c.on .rt-dlg-cn{color:var(--rt-accent,#ff9638)} .rt-dlg-cd{display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;color:var(--ink-faint);margin-top:2px} .rt-dlg-row{display:flex;align-items:center;justify-content:space-between;padding:8px 2px;border-bottom:1px solid var(--line)} .rt-dlg-l{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)} .rt-dlg-sw{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:8px} .rt-dlg-swatch{aspect-ratio:1;border:2px solid var(--line-mid);border-radius:4px;cursor:pointer;padding:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)} .rt-dlg-swatch.on{border-color:var(--ink,#f6f8fb);box-shadow:0 0 0 2px var(--bg-1,#0e131b),0 0 0 3px var(--ink,#f6f8fb)} .rt-dlg-picker{width:44px;height:30px;border:2px solid var(--line-mid);border-radius:4px;padding:0;background:none;cursor:pointer;-webkit-appearance:none;appearance:none} .rt-dlg-picker::-webkit-color-swatch-wrapper{padding:0} .rt-dlg-picker::-webkit-color-swatch{border:0;border-radius:2px} .rt-dlg-preview{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bg-0,#080b11);border:1px solid var(--line)} .rt-dlg-pvframe{width:34px;height:46px;border:1.5px solid var(--rt-accent,#ff9638);border-radius:2px;box-shadow:0 0 14px -2px var(--rt-accent,#ff9638);flex:none} .rt-dlg-pvtext{font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--vfd,#5ff2d0);border-left:2px solid var(--rt-accent,#ff9638);padding-left:10px} .rt-dlg-foot{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:12px 14px;border-top:1px solid var(--line-mid)} .rt-dlg-b{background:var(--bg-2,#151c26);border:1px solid var(--line-mid);color:var(--ink,#f6f8fb); font-family:var(--font-display,var(--font-mono));font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:11px 8px;cursor:pointer;border-radius:2px} .rt-dlg-b:hover,.rt-dlg-b:focus-visible{border-color:var(--rt-accent,#ff9638);color:var(--rt-accent,#ff9638);outline:none} html.rt-on .rt-dlg-bg,html.rt-on .rt-dlg-bg *{cursor:none} /* ---------- seal3d: record header seal (A) ---------- */ .rec-head{display:flex;gap:1.6rem;align-items:center} .rec-head-text{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center} .rec-head-text h1{margin-top:0;margin-bottom:.9rem} .rec-head-text .franchise-line{margin-top:0} .rec-head-text .finding{margin-top:0} .rec-seal3d{flex:none;width:200px;height:200px;cursor:grab;touch-action:none;user-select:none} .rec-seal3d:active{cursor:grabbing} .rec-seal3d canvas{display:block;width:100%;height:100%} html.rt-on .rec-seal3d,html.rt-on .rec-seal3d canvas{cursor:none} @media (max-width:640px){ .rec-head{flex-direction:column;gap:.8rem;align-items:stretch} .rec-seal3d{width:150px;height:150px;margin:0 auto} } /* ---------- seal3d: card takeover (C1) ---------- */ [data-reticle="card"] .art{position:relative} html[data-reticle-mode="touch"] [data-reticle="card"]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none} .s3-fill{position:absolute;inset:0;background:var(--bg-0,#080b11);opacity:0;pointer-events:none; transition:opacity 120ms linear} .s3-cv{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none} /* touch: live seal in the card's seal slot */ .s3-card{display:block;flex-shrink:0;margin:-4px}