/* Author: GPT-6.1 Sol (Medium)
Date: 12-November-2026
PURPOSE: Responsive Research Instrument visual system for the Logical Arbitrage site. Styles semantic content, sourced before/after replay frames, dated findings, real game imagery, focus states and reduced-motion behavior.
SRP/DRY check: Pass — shared spacing, colors and section primitives serve the complete static site. */
:root{--paper:#f2f1e9;--ink:#183c35;--muted:#626e65;--line:#d2d8cc;--accent:#c35d34;--white:#fcfcf6}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:6px}::selection{background:#d7dfaf}.wrap{width:min(1280px,calc(100% - 96px));margin-inline:auto}.site-header{display:flex;align-items:center;justify-content:space-between;padding-block:29px;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:11px;font-size:11px;font-weight:800;letter-spacing:1.3px;line-height:1.25}.site-header nav{display:flex;gap:35px;font-size:13px}.site-header nav a{padding:8px 0}.site-header a:hover,.research-row:hover h3{color:var(--accent)}.nav-cta{font-size:12px;font-weight:600}.nav-cta span{margin-left:20px}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;padding-top:72px;padding-bottom:70px;align-items:center}.eyebrow{font-family:'Courier New',monospace;font-size:10px;line-height:1.6;letter-spacing:1.6px;font-weight:700;margin:0 0 26px}.signal{display:inline-block;width:6px;height:6px;background:var(--accent);margin-right:7px;vertical-align:1px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-3.7px;line-height:1.03}h1{font-size:clamp(60px,6.8vw,94px);margin-bottom:26px}h1 em,h2 em{font-weight:400;color:var(--accent)}.intro{font-size:16px;line-height:1.65;max-width:360px;margin-bottom:27px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:55px;padding:17px 22px;background:var(--ink);color:var(--paper);font-size:12px;font-weight:600;transition:background .15s}.button:hover{background:#2e5b4e}.hero-note{font-size:10px;color:var(--muted);margin-top:17px}.instrument{background:#e6e8dd;border:1px solid #c7cec0;padding:18px;align-self:center;position:relative}.instrument-top,.instrument-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:'Courier New',monospace;font-size:9px;font-weight:700;letter-spacing:.9px}.instrument-top{padding:1px 0 16px}.serial{color:var(--muted)}.board-stage{position:relative;background:#172820;aspect-ratio:1.06;display:flex;align-items:center;justify-content:center;overflow:hidden}.board-grid{position:absolute;inset:0;background-image:linear-gradient(#69827016 1px,transparent 1px),linear-gradient(90deg,#69827016 1px,transparent 1px);background-size:22px 22px}.board-stage img{width:76%;height:80%;object-fit:contain;image-rendering:pixelated;position:relative;filter:drop-shadow(0 12px 20px #0003)}.corner{position:absolute;width:16px;height:16px;border-color:#a5b9a0}.tl{top:14px;left:14px;border-left:1px solid;border-top:1px solid}.br{bottom:14px;right:14px;border-right:1px solid;border-bottom:1px solid}.instrument-bottom{padding:15px 0;font-size:9px;letter-spacing:.2px}.instrument-bottom a{text-decoration:underline;text-underline-offset:3px}.selector{display:flex;gap:6px;align-items:center;border-top:1px solid #c7cec0;padding-top:12px}.selector button{border:1px solid #bdc6b6;background:transparent;padding:8px 12px;font:10px 'Courier New',monospace;color:var(--ink);cursor:pointer}.selector button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.selector button:hover{border-color:var(--ink)}.selector>span{font:8px 'Courier New',monospace;margin-left:auto;color:var(--muted)}.image-note{font-size:9px;line-height:1.5;color:var(--muted);margin:13px 0 0}.principles{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.principles-inner{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:24px}.principles span{font:9px 'Courier New',monospace;letter-spacing:1px}.principles p{font-family:Georgia,serif;font-size:21px;margin:0}.principles a{font-size:11px}.principles a span{margin-left:15px}.section{padding-block:95px}h2{font-size:53px;letter-spacing:-2px;line-height:1.1;margin-bottom:24px}.section-heading{display:grid;grid-template-columns:1.5fr 1fr;column-gap:80px;align-items:end}.section-heading .eyebrow{grid-column:1/-1;margin-bottom:22px}.section-heading h2{margin:0}.section-heading>p:last-child{font-size:14px;line-height:1.75;max-width:365px;margin:0 0 3px}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:45px;border:1px solid var(--line)}.work-card{padding:30px 28px 26px;border-right:1px solid var(--line);display:flex;flex-direction:column}.work-card:last-child{border-right:0}.card-index{font:9px 'Courier New',monospace;letter-spacing:1px;color:var(--muted)}.pixel-icon{font-size:38px;margin:30px 0 15px;color:var(--accent);height:47px}.work-card h3{font-family:Georgia,serif;font-weight:400;font-size:26px;letter-spacing:-.6px;margin-bottom:15px}.work-card p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:25px}.work-card a{font-size:11px;font-weight:600;margin-top:auto}.work-card a span{float:right}.approach{background:#183c35;color:#f1f1e5}.approach-heading{display:grid;grid-template-columns:1.4fr 1fr;gap:0 120px;align-items:end}.approach-heading .eyebrow{grid-column:1/-1;color:#b6c9b5}.approach-heading h2{margin:0}.approach-heading>p:last-child{font-size:14px;line-height:1.8;color:#c1cec0;max-width:340px;margin:0}.loop{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);padding:0;margin:55px 0 30px}.loop li{border-top:1px solid #547365;border-right:1px solid #547365;padding:23px 24px 10px 0;margin-right:24px;position:relative}.loop li:last-child{margin-right:0;border-right:0}.step{font:10px 'Courier New',monospace;color:#dc9b76}.loop h3{font-family:Georgia,serif;font-size:27px;font-weight:400;margin:22px 0 14px}.loop p{color:#c1cec0;font-size:12px;line-height:1.8;margin:0}.approach-foot{display:flex;gap:20px;border-top:1px solid #547365;padding-top:22px;color:#b4c5b4}.approach-foot span{color:#d99472;font-size:26px}.approach-foot p{font-size:10px;line-height:1.7;max-width:710px;margin:0}.research-top{display:flex;justify-content:space-between;align-items:end;gap:70px}.research-top>p{font-size:14px;line-height:1.8;max-width:350px;margin-bottom:28px}.research-list{margin-top:18px;border-top:1px solid var(--line)}.research-row{display:grid;grid-template-columns:190px 1fr 40px;gap:30px;border-bottom:1px solid var(--line);padding:29px 0;align-items:center}.research-type{font:9px 'Courier New',monospace;letter-spacing:1px;color:var(--muted)}.research-row h3{font-family:Georgia,serif;font-size:25px;font-weight:400;letter-spacing:-.5px;margin:0 0 10px}.research-row p{font-size:12px;line-height:1.6;color:var(--muted);margin:0}.arrow{font-size:25px;text-align:right}.research-disclosure{font-size:10px;line-height:1.8;color:var(--muted);max-width:730px;margin:23px 0 0}.engineering{display:grid;grid-template-columns:1.1fr 1fr;gap:110px;padding:0 0 90px;align-items:center}.engineering h2{font-size:45px}.engineering p:not(.eyebrow){font-size:13px;line-height:1.8;max-width:460px}.muted{color:var(--muted);font-size:11px!important}.system-map{background:#e5e8db;border:1px solid #ccd3c3;padding:25px 34px}.system-map>div{border:1px solid #becab6;padding:16px;background:#f2f2e9}.system-map span:not(.map-link){display:block;font:8px 'Courier New',monospace;letter-spacing:1px;color:var(--muted);margin-bottom:8px}.system-map strong{font-size:12px;font-weight:500}.map-link{display:block;text-align:center;color:var(--accent);font-size:21px;line-height:30px}.closing{border-top:1px solid var(--line);padding-block:80px;text-align:center}.closing h2{font-size:60px;margin-bottom:30px}.closing .eyebrow{color:var(--accent)}footer{border-top:1px solid var(--line);padding:32px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}footer>p,footer>a:not(.brand){font-size:10px;color:var(--muted);margin:0}.footer-note{flex-basis:100%;border-top:1px solid var(--line);padding-top:20px;font-size:9px;line-height:1.6;color:var(--muted);margin-top:10px}.skip{position:absolute;top:-100px;left:20px;background:var(--ink);color:white;padding:15px;z-index:20}.skip:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1450px){.hero{padding-block:95px;gap:110px}}@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.hero{gap:35px}h1{font-size:65px}.eyebrow{font-size:9px;letter-spacing:1px}.selector>span{display:none}.section-heading{gap:30px}h2{font-size:44px}.approach-heading{gap:40px}.work-card{padding:25px 20px}.work-card h3{font-size:23px}.engineering{gap:50px}.research-row{grid-template-columns:150px 1fr 30px}}@media(max-width:700px){.wrap{width:calc(100% - 40px)}.site-header{padding-block:21px}.site-header nav{gap:18px;font-size:11px}.nav-cta{display:none}.brand{font-size:9px}.hero{grid-template-columns:1fr;padding-top:43px;padding-bottom:43px;gap:32px}h1{font-size:70px;letter-spacing:-3px}.intro{font-size:14px;max-width:350px}.instrument{max-width:480px;width:100%}.hero-note{margin-bottom:0}.selector>span{display:block}.principles-inner{flex-wrap:wrap;gap:12px;padding-block:22px}.principles p{font-size:20px;flex-basis:100%}.principles a{font-size:10px}.section{padding-block:60px}h2{font-size:39px;letter-spacing:-1.6px}.section-heading,.approach-heading{display:block}.section-heading>p:last-child{margin-top:22px;max-width:100%;font-size:13px}.work-grid{grid-template-columns:1fr;margin-top:30px}.work-card{padding:25px;border-right:0;border-bottom:1px solid var(--line)}.work-card:last-child{border-bottom:0}.pixel-icon{margin:20px 0 10px}.work-card h3{font-size:27px}.work-card p{max-width:440px}.approach-heading>p:last-child{margin-top:24px;font-size:13px;max-width:100%}.loop{grid-template-columns:1fr 1fr;gap:22px;margin-top:35px}.loop li{margin:0;padding-right:15px}.loop li:nth-child(2){border-right:0}.loop h3{margin-top:15px}.research-top{display:block}.research-top>p{max-width:100%;font-size:13px}.research-row{grid-template-columns:1fr 24px;gap:14px;padding-block:24px}.research-type{grid-column:1/-1}.research-row h3{font-size:23px}.research-disclosure{font-size:10px}.engineering{grid-template-columns:1fr;gap:27px;padding-bottom:55px}.engineering h2{font-size:39px}.system-map{padding:25px}.closing{padding-block:55px}.closing h2{font-size:43px}footer{gap:20px}footer>p{display:none}.image-note{font-size:9px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Recorded frames reuse the research palette; captions distinguish observation from interpretation. */
.recorded{border-bottom:1px solid var(--line)}.replay-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:40px}.replay-card{border:1px solid var(--line);padding:27px}.replay-card h3{font:28px Georgia,serif;margin:18px 0}.replay-card>p:not(.card-index){font-size:13px;line-height:1.75}.frame-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.frame-pair figure{margin:0;min-width:0}.frame-pair img{display:block;width:100%;height:auto;image-rendering:pixelated;background:#172820}.frame-pair figcaption{font:10px/1.6 'Courier New',monospace;margin-top:9px;color:var(--muted)}.replay-note{font-size:11px!important;line-height:1.8;color:var(--muted)}.replay-source{font-size:11px;line-height:1.8;color:var(--muted);margin:24px 0 0}.replay-source a,.text-link{text-decoration:underline;text-underline-offset:4px}.findings{display:grid;grid-template-columns:1fr 1.1fr;gap:85px;padding-bottom:85px}.findings-copy p{font-size:14px;line-height:1.8}.text-link{font-size:12px}.findings h2{font-size:45px}
@media(max-width:1000px){.replay-card{padding:21px}.replay-grid{gap:20px}.findings{gap:40px}}
@media(max-width:700px){.replay-grid,.findings{grid-template-columns:1fr}.replay-card{padding:22px}.findings{gap:10px;padding-bottom:55px}.findings h2{font-size:39px}.frame-pair{gap:10px}}