Something went wrong. Try again.
My website. cameron.stream
Something went wrong. Try again.
CSS
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040/* Hidden artifact index and field guides */
.artifacts-page,.tinker-page { --artifact-ink: var(--site-text); --artifact-paper: var(--site-bg); --artifact-rule: var(--site-border); --artifact-muted: var(--site-text-muted); --artifact-purple: #b497bf; width: 100%;}
.tinker-shell { max-width: 880px; margin: 0 auto; padding: 0 1.25rem;}
.artifact-topline,.tinker-nav { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; border-bottom: 1px solid var(--artifact-rule); padding: 1.25rem 0; color: var(--artifact-muted); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.12em;}
.artifact-topline a,.tinker-nav a { color: var(--artifact-ink); text-decoration: none;}
.artifact-home { font-family: var(--site-font-display); font-size: 0.92rem; font-weight: 400;}
.artifacts-header { padding: clamp(5rem, 14vw, 9rem) 0 clamp(3rem, 8vw, 5rem);}
.artifact-kicker,.tinker-mini-label { margin: 0 0 1rem; color: var(--artifact-muted); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.16em;}
.artifacts-header h1 { margin: 0; font-size: clamp(2.1rem, 10vw, 8rem); letter-spacing: 0.05em;}
.artifacts-header > p:last-child { max-width: 31rem; margin: 1.8rem 0 0 auto; color: var(--site-text-secondary); font-size: clamp(1rem, 2.5vw, 1.22rem); line-height: 1.65;}
.artifact-index { border-top: 1px solid var(--artifact-ink);}
.artifact-row { display: grid; grid-template-columns: 3.5rem 1fr 2rem; gap: 1rem; align-items: start; border-bottom: 1px solid var(--artifact-rule); padding: 1.8rem 0; color: var(--artifact-ink); text-decoration: none; transition: padding 160ms ease, color 160ms ease;}
.artifact-row:hover { padding-left: 0.5rem; color: var(--artifact-purple);}
.artifact-number,.artifact-row-meta { color: var(--artifact-muted); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.12em;}
.artifact-row-body { display: flex; flex-direction: column; gap: 0.3rem;}
.artifact-row-body strong { font-family: var(--site-font-display); font-size: clamp(1.7rem, 5vw, 2.7rem); font-weight: 400; letter-spacing: 0.04em;}
.artifact-row-body > span:last-child { max-width: 35rem; color: var(--site-text-secondary); font-size: 0.88rem; line-height: 1.5;}
.artifact-arrow { font-size: 1.5rem;}
.artifact-index-footer { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem 0 4rem; color: var(--artifact-muted); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.1em;}
/* Tinker field guide */
.tinker-nav > div { display: flex; gap: 1.4rem;}
.tinker-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.72fr); align-items: center; min-height: min(50rem, 86vh); border-bottom: 1px solid var(--artifact-ink); padding: 4rem 0 2rem; overflow: hidden;}
.tinker-hero h1 { margin: 0; font-size: clamp(5rem, 17vw, 11rem); letter-spacing: 0.05em; line-height: 0.8;}
.tinker-hero-copy,.tinker-hero-copy > * { min-width: 0;}
.tinker-deck { max-width: 33rem; margin: 2rem 0 0; font-size: clamp(1.15rem, 3vw, 1.7rem); line-height: 1.35;}
.tinker-hero-meta { grid-column: 1 / -1; display: flex; justify-content: space-between; align-self: end; gap: 1rem; margin-top: 3rem; color: var(--artifact-muted); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.12em;}
.tinker-orbit { position: relative; width: min(32vw, 24rem); aspect-ratio: 1; justify-self: end;}
.tinker-orbit-ring,.tinker-orbit-core,.tinker-orbit-node { position: absolute;}
.tinker-orbit-ring { inset: 0; border: 1px solid var(--artifact-rule); border-radius: 50%;}
.tinker-orbit-ring-inner { inset: 28%; border-color: var(--artifact-purple);}
.tinker-orbit-core { top: 50%; left: 50%; transform: translate(-50%, -52%); color: var(--artifact-purple); font-family: Georgia, serif; font-size: clamp(3rem, 7vw, 5.4rem);}
.tinker-orbit-node { border: 1px solid var(--artifact-rule); border-radius: 999px; padding: 0.35rem 0.55rem; background: var(--artifact-paper); color: var(--artifact-muted); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.1em;}
.tinker-orbit-data { top: 8%; left: 8%; }.tinker-orbit-loss { top: 18%; right: -2%; }.tinker-orbit-sample { bottom: 5%; left: 20%; }
.tinker-section { border-bottom: 1px solid var(--artifact-rule); padding: clamp(3.5rem, 8vw, 6.5rem) 0;}
.tinker-section-label { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; margin-bottom: clamp(2.5rem, 6vw, 4.5rem); color: var(--artifact-muted); font-size: 0.64rem; font-weight: 700; letter-spacing: 0.14em;}
.tinker-opening-grid,.tinker-explainer-head,.tinker-eval-intro { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: clamp(2rem, 7vw, 6rem);}
.tinker-opening-grid h2,.tinker-explainer-head h2,.tinker-eval-intro h2 { margin: 0; font-family: var(--site-font-body); font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 600; letter-spacing: -0.045em; line-height: 1.05;}
.tinker-opening-grid p,.tinker-explainer-head p,.tinker-eval-intro p { margin: 0 0 1rem; color: var(--site-text-secondary); font-size: 1rem; line-height: 1.75;}
.tinker-boundary { display: grid; grid-template-columns: 1fr 7.5rem 1fr; border: 1px solid var(--artifact-rule);}
.tinker-boundary-side { padding: clamp(1.5rem, 4vw, 2.7rem);}
.tinker-boundary-side h2 { margin: 0 0 1.5rem; font-family: var(--site-font-body); font-size: 1.4rem; font-weight: 650; letter-spacing: -0.025em;}
.tinker-boundary-side ul { margin: 0; padding: 0; list-style: none;}
.tinker-boundary-side li { border-top: 1px solid var(--artifact-rule); padding: 0.62rem 0; color: var(--site-text-secondary); font-size: 0.82rem;}
.tinker-api-spine { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1.4rem; border-right: 1px solid var(--artifact-rule); border-left: 1px solid var(--artifact-rule); padding: 1.2rem 0; background: color-mix(in srgb, var(--artifact-purple) 16%, var(--artifact-paper)); writing-mode: vertical-rl;}
.tinker-api-spine span { font-size: 0.52rem; font-weight: 700; letter-spacing: 0.1em;}
.tinker-api-spine strong { color: var(--artifact-purple); font-family: var(--site-font-display); font-size: 1.2rem; font-weight: 400;}
.tinker-caption { max-width: 40rem; margin: 1rem 0 0 auto; color: var(--artifact-muted); font-size: 0.78rem; line-height: 1.55;}
.tinker-verbs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--artifact-ink); border-bottom: 1px solid var(--artifact-ink);}
.tinker-verbs article { min-width: 0; padding: 1.4rem 1rem 1.7rem;}
.tinker-verbs article + article { border-left: 1px solid var(--artifact-rule);}
.tinker-verbs article > span,.tinker-agent-notes article > span,.tinker-eval-grid article > span { color: var(--artifact-muted); font-size: 0.62rem; font-weight: 700;}
.tinker-verbs h3 { margin: 2.7rem 0 0.7rem; overflow-wrap: anywhere; font-family: "SF Mono", "Menlo", monospace; font-size: 0.92rem; font-weight: 500;}
.tinker-verbs p { margin: 0; color: var(--site-text-secondary); font-size: 0.76rem; line-height: 1.5;}
.tinker-large-note { max-width: 48rem; margin: 4rem 0 0 auto; font-family: var(--site-font-display); font-size: clamp(2rem, 6vw, 4rem); letter-spacing: 0.025em; line-height: 1.04;}
.tinker-flow,.tinker-trace { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; margin: 3.5rem 0; border-top: 1px solid var(--artifact-rule); border-bottom: 1px solid var(--artifact-rule); padding: 1rem 0; color: var(--artifact-muted); font-size: 0.59rem; font-weight: 700; letter-spacing: 0.08em;}
.tinker-flow-arrow { color: var(--artifact-purple); font-size: 1rem;}
.tinker-code-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem;}
.tinker-code-grid article,.tinker-code-card-wide { min-width: 0; border: 1px solid var(--artifact-rule); background: var(--site-code-bg); overflow: hidden;}
.tinker-code-header { display: flex; justify-content: space-between; border-bottom: 1px solid var(--artifact-rule); padding: 0.65rem 0.9rem; color: var(--artifact-muted); font-size: 0.57rem; font-weight: 700; letter-spacing: 0.1em;}
.tinker-code-grid pre,.tinker-code-card-wide pre { max-width: 100%; margin: 0; padding: 1.1rem; overflow-x: auto; color: var(--artifact-ink); font-family: "SF Mono", "Menlo", monospace; font-size: 0.7rem; line-height: 1.65;}
.tinker-concept-card { display: grid; grid-template-columns: 0.55fr 1fr 1.15fr; gap: 1.5rem; margin-top: 1rem; border: 1px solid var(--artifact-purple); padding: 1.5rem;}
.tinker-concept-card h3 { margin: 0; font-size: 1.08rem; line-height: 1.3;}
.tinker-concept-card > p:last-child { margin: 0; color: var(--site-text-secondary); font-size: 0.84rem; line-height: 1.6;}
.tinker-lora-section,.tinker-first-run { margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding-right: max(1.25rem, calc((100vw - 880px) / 2)); padding-left: max(1.25rem, calc((100vw - 880px) / 2)); color: #f0edf1; background: #121113;}
.tinker-section-label-dark { color: #8f8992;}
.tinker-lora-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2rem, 7vw, 6rem);}
.tinker-equation { margin: 0; color: #c9aecf; font-family: Georgia, serif; font-size: clamp(2.5rem, 7vw, 5.3rem); line-height: 1; white-space: nowrap;}
.tinker-equation-key { margin: 1.1rem 0 0; color: #8f8992; font-size: 0.57rem; font-weight: 700; letter-spacing: 0.11em;}
.tinker-lora-copy h2 { margin: 0 0 1.5rem; font-family: var(--site-font-body); font-size: clamp(1.65rem, 4vw, 2.6rem); font-weight: 600; letter-spacing: -0.04em; line-height: 1.08;}
.tinker-lora-copy p { color: #b9b3bc; font-size: 0.94rem; line-height: 1.7;}
.tinker-lora-facts { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 4rem; border-top: 1px solid #353137; border-bottom: 1px solid #353137;}
.tinker-lora-facts div { padding: 1.25rem;}
.tinker-lora-facts div + div { border-left: 1px solid #353137;}
.tinker-lora-facts strong,.tinker-lora-facts span { display: block;}
.tinker-lora-facts strong { color: #c9aecf; font-family: var(--site-font-display); font-size: 1.2rem; font-weight: 400; letter-spacing: 0.06em;}
.tinker-lora-facts span { margin-top: 0.4rem; color: #8f8992; font-size: 0.72rem;}
.tinker-rl-loop { display: grid; grid-template-columns: repeat(9, auto); align-items: center; justify-content: space-between; gap: 0.65rem; margin: 3.5rem 0;}
.tinker-rl-loop div { display: flex; flex-direction: column; gap: 0.12rem;}
.tinker-rl-loop div > span { color: var(--artifact-purple); font-size: 0.58rem; font-weight: 700;}
.tinker-rl-loop strong { font-size: 0.66rem; letter-spacing: 0.08em;}
.tinker-rl-loop small { color: var(--artifact-muted); font-size: 0.62rem;}
.tinker-rl-detail { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 1rem;}
.tinker-rl-detail,.tinker-rl-detail > * { min-width: 0;}
.tinker-rl-detail aside { border: 1px solid var(--artifact-rule); padding: 1.25rem;}
.tinker-rl-detail aside > p:last-child { color: var(--site-text-secondary); font-size: 0.8rem; line-height: 1.6;}
.tinker-ratio { margin: 2.5rem 0; font-family: Georgia, serif; font-size: clamp(1.3rem, 2.5vw, 1.75rem); white-space: nowrap;}
.tinker-agents-grid > h2 { max-width: 45rem; margin: 0; font-family: var(--site-font-display); font-size: clamp(2.6rem, 8vw, 5.5rem); font-weight: 400; letter-spacing: 0.03em; line-height: 1;}
.tinker-trace { margin-top: 4rem;}
.tinker-agent-notes,.tinker-eval-grid,.tinker-map { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--artifact-rule);}
.tinker-agent-notes article,.tinker-eval-grid article,.tinker-map article { padding: 1.4rem 1.2rem;}
.tinker-agent-notes article + article,.tinker-eval-grid article + article,.tinker-map article + article { border-left: 1px solid var(--artifact-rule);}
.tinker-agent-notes h3,.tinker-eval-grid h3,.tinker-map h3 { margin: 2.5rem 0 0.7rem; font-size: 1rem;}
.tinker-agent-notes p,.tinker-eval-grid p,.tinker-map p { margin: 0; color: var(--site-text-secondary); font-size: 0.78rem; line-height: 1.55;}
.tinker-eval-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 3.5rem; border-bottom: 1px solid var(--artifact-rule);}
.tinker-first-run-head { max-width: 47rem;}
.tinker-first-run-head h2 { margin: 0; font-family: var(--site-font-display); font-size: clamp(2.5rem, 7vw, 5rem); font-weight: 400; letter-spacing: 0.035em; line-height: 1;}
.tinker-first-run-head > p:last-child { max-width: 36rem; margin: 1.5rem 0 0 auto; color: #b9b3bc; line-height: 1.7;}
.tinker-protocol { margin: 4rem 0 0; padding: 0; border-top: 1px solid #353137; list-style: none;}
.tinker-protocol li { display: grid; grid-template-columns: 4rem 1fr; border-bottom: 1px solid #353137; padding: 1.15rem 0;}
.tinker-protocol li > span { color: #8f8992; font-size: 0.62rem; font-weight: 700;}
.tinker-protocol strong { display: block; font-size: 0.95rem;}
.tinker-protocol p { margin: 0.3rem 0 0; color: #8f8992; font-size: 0.78rem; line-height: 1.5;}
.tinker-hypothesis { display: grid; grid-template-columns: 0.35fr 1fr; gap: 2rem; margin-top: 3rem; border: 1px solid #c9aecf; padding: 1.5rem;}
.tinker-hypothesis span { color: #c9aecf; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.12em;}
.tinker-hypothesis p { margin: 0; font-size: 1.05rem; line-height: 1.55;}
.tinker-map { grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--artifact-rule);}
.tinker-map article > span { color: var(--artifact-purple); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.1em;}
.tinker-glossary dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--artifact-rule);}
.tinker-glossary dl > div { display: grid; grid-template-columns: 0.55fr 1fr; gap: 1rem; border-bottom: 1px solid var(--artifact-rule); padding: 1rem 0;}
.tinker-glossary dl > div:nth-child(odd) { padding-right: 1.2rem;}
.tinker-glossary dl > div:nth-child(even) { border-left: 1px solid var(--artifact-rule); padding-left: 1.2rem;}
.tinker-glossary dt { font-size: 0.78rem; font-weight: 700;}
.tinker-glossary dd { margin: 0; color: var(--site-text-secondary); font-size: 0.75rem; line-height: 1.5;}
.tinker-footer { display: grid; grid-template-columns: 1fr auto; gap: 2rem; padding: 4rem 0 5rem;}
.tinker-footer > div:first-child { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem;}
.tinker-footer > div:first-child > span { margin-bottom: 0.6rem; color: var(--artifact-muted); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.12em;}
.tinker-footer a { color: var(--artifact-ink); font-size: 0.72rem; font-weight: 600; text-decoration: none;}
.tinker-footer a:hover { color: var(--artifact-purple);}
.tinker-footer-mark { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.7rem; width: 9rem; aspect-ratio: 1; border: 1px solid var(--artifact-rule); border-radius: 50%; color: var(--artifact-purple);}
.tinker-footer-mark strong { font-family: Georgia, serif; font-size: 2.5rem; font-weight: 400;}
.tinker-footer-mark span { font-size: 0.5rem; font-weight: 700; letter-spacing: 0.1em;}
@media (max-width: 760px) { .tinker-hero { grid-template-columns: 1fr; min-height: auto; padding-top: 6rem; }
.tinker-orbit { width: min(72vw, 20rem); margin: 4rem auto 1rem; justify-self: center; }
.tinker-hero-meta { flex-direction: column; }
.tinker-opening-grid, .tinker-explainer-head, .tinker-eval-intro, .tinker-lora-grid, .tinker-rl-detail { grid-template-columns: minmax(0, 1fr); }
.tinker-boundary { grid-template-columns: 1fr; }
.tinker-api-spine { flex-direction: row; justify-content: space-around; border: 0; border-top: 1px solid var(--artifact-rule); border-bottom: 1px solid var(--artifact-rule); writing-mode: horizontal-tb; }
.tinker-api-spine span:nth-of-type(2), .tinker-api-spine span:nth-of-type(3) { display: none; }
.tinker-verbs { grid-template-columns: 1fr; }
.tinker-verbs article { display: grid; grid-template-columns: 2.2rem minmax(7rem, 0.65fr) 1fr; gap: 1rem; align-items: start; }
.tinker-verbs article + article { border-top: 1px solid var(--artifact-rule); border-left: 0; }
.tinker-verbs h3 { margin: 0; }
.tinker-code-grid, .tinker-concept-card { grid-template-columns: 1fr; }
.tinker-lora-facts, .tinker-agent-notes, .tinker-eval-grid, .tinker-map { grid-template-columns: 1fr; }
.tinker-lora-facts div + div, .tinker-agent-notes article + article, .tinker-eval-grid article + article, .tinker-map article + article { border-top: 1px solid var(--artifact-rule); border-left: 0; }
.tinker-lora-facts div + div { border-top-color: #353137; }
.tinker-rl-loop { grid-template-columns: 1fr; justify-items: start; border-left: 1px solid var(--artifact-rule); padding-left: 1rem; }
.tinker-rl-loop .tinker-flow-arrow { transform: rotate(90deg); }
.tinker-glossary dl { grid-template-columns: 1fr; }
.tinker-glossary dl > div:nth-child(odd), .tinker-glossary dl > div:nth-child(even) { border-left: 0; padding-right: 0; padding-left: 0; }}
@media (max-width: 480px) { .artifact-topline, .tinker-nav { align-items: flex-start; }
.tinker-nav > div { flex-direction: column; align-items: flex-end; gap: 0.35rem; }
.artifact-row { grid-template-columns: 2.4rem 1fr; }
.artifact-arrow { display: none; }
.artifact-index-footer { flex-direction: column; }
.tinker-hero h1 { font-size: min(18vw, 6rem); }
.tinker-section-label { grid-template-columns: 2rem 1fr; }
.tinker-flow, .tinker-trace { align-items: flex-start; flex-direction: column; border-left: 1px solid var(--artifact-rule); padding-left: 1rem; }
.tinker-flow .tinker-flow-arrow, .tinker-trace .tinker-flow-arrow { transform: rotate(90deg); }
.tinker-equation { font-size: 2.25rem; }
.tinker-large-note { font-size: 1.65rem; }
.tinker-first-run-head h2 { font-size: 2rem; }
.tinker-hypothesis, .tinker-glossary dl > div { grid-template-columns: 1fr; }
.tinker-footer { grid-template-columns: 1fr; }
.tinker-footer-mark { margin-top: 2rem; }}
@media (prefers-reduced-motion: reduce) { .artifact-row { transition: none; }}