Gopher Telos Engine

#gte-root { font-family: -apple-system, BlinkMacSystemFont, ‘Segoe UI’, sans-serif; max-width: 900px; margin: 0 auto; color: #1a1a1a; } #gte-root * { box-sizing: border-box; } #gte-root h1,#gte-root h2,#gte-root h3,#gte-root h4,#gte-root p,#gte-root ul { margin: 0; padding: 0; } /* ── Hero ── */ .gte-hero { background: #26215C; color: #fff; padding: 36px 32px 28px; border-radius: 12px; margin-bottom: 24px; } .gte-hero-eyebrow { font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #AFA9EC; margin-bottom: 10px; } .gte-hero h1 { font-size: 28px; font-weight: 700; color: #fff; margin-bottom: 8px; line-height: 1.2; } .gte-hero p { font-size: 14px; color: #CEC BF6; line-height: 1.6; max-width: 600px; color: #CECBF6; } .gte-hero-stats { display: flex; gap: 24px; margin-top: 20px; flex-wrap: wrap; } .gte-stat { } .gte-stat-num { font-size: 22px; font-weight: 700; color: #fff; } .gte-stat-label { font-size: 11px; color: #AFA9EC; margin-top: 1px; } /* ── Level Nav ── */ .gte-nav { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; } .gte-nav-btn { padding: 7px 15px; border: 1.5px solid #d0cce8; background: #fff; border-radius: 8px; font-size: 13px; cursor: pointer; color: #5F5E5A; transition: all 0.15s; font-family: inherit; font-weight: 500; } .gte-nav-btn:hover { border-color: #7F77DD; color: #3C3489; background: #EEEDFE; } .gte-nav-btn.active { background: #3C3489; border-color: #3C3489; color: #EEEDFE; } /* ── Level Header ── */ .gte-level-header { display: flex; align-items: flex-start; gap: 16px; padding: 20px; background: #f8f7ff; border: 1px solid #e8e6f8; border-radius: 12px; margin-bottom: 16px; } .gte-level-badge { flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; background: #EEEDFE; display: flex; align-items: center; justify-content: center; font-size: 24px; } .gte-level-info h2 { font-size: 18px; font-weight: 700; color: #26215C; margin-bottom: 2px; } .gte-level-subtitle { font-size: 12px; color: #888780; margin-bottom: 6px; } .gte-level-desc { font-size: 13px; color: #444441; line-height: 1.6; } .gte-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; } .gte-tag { font-size: 11px; padding: 3px 10px; border-radius: 20px; font-weight: 500; } .gte-tag-purple { background: #EEEDFE; color: #3C3489; } .gte-tag-teal { background: #E1F5EE; color: #0F6E56; } .gte-tag-amber { background: #FAEEDA; color: #854F0B; } /* ── Depth Bar ── */ .gte-depth-row { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; } .gte-depth-label { font-size: 12px; color: #888780; min-width: 130px; } .gte-depth-track { flex: 1; height: 7px; background: #f0eeea; border-radius: 4px; overflow: hidden; } .gte-depth-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; } .gte-depth-pct { font-size: 12px; color: #888780; min-width: 36px; text-align: right; } /* ── Section Label ── */ .gte-section-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #888780; margin: 24px 0 10px; } /* ── Legend ── */ .gte-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; } .gte-legend-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #5F5E5A; } .gte-legend-dot { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; } /* ── Matrix ── */ .gte-matrix { display: grid; grid-template-columns: 24px repeat(3, 1fr); gap: 4px; margin-bottom: 24px; } .gte-matrix-header { font-size: 11px; font-weight: 700; text-align: center; padding: 8px 6px; background: #f8f7ff; border-radius: 6px; color: #5F5E5A; border: 1px solid #e8e6f8; } .gte-row-num { font-size: 11px; color: #B4B2A9; display: flex; align-items: center; justify-content: center; font-weight: 600; } .gte-cell { padding: 9px 11px; font-size: 12px; border-radius: 7px; border: 1px solid #e8e6f8; background: #fff; color: #1a1a1a; cursor: pointer; transition: all 0.15s; line-height: 1.5; } .gte-cell:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(0,0,0,0.08); } .gte-cell.s1 { border-left: 3px solid #7F77DD; } .gte-cell.s1:hover { background: #EEEDFE; border-color: #7F77DD; } .gte-cell.s2 { border-left: 3px solid #1D9E75; } .gte-cell.s2:hover { background: #E1F5EE; border-color: #1D9E75; } .gte-cell.s3 { border-left: 3px solid #EF9F27; } .gte-cell.s3:hover { background: #FAEEDA; border-color: #EF9F27; } .gte-cell-tip { font-size: 10px; color: #B4B2A9; margin-top: 4px; } /* ── Word Banks ── */ .gte-word-banks { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 24px; } .gte-word-bank { background: #fff; border: 1px solid #e8e6f8; border-radius: 10px; padding: 14px; } .gte-word-bank h4 { font-size: 12px; font-weight: 700; margin-bottom: 10px; color: #26215C; } .gte-word-list { display: flex; flex-wrap: wrap; gap: 5px; } .gte-word { font-size: 12px; padding: 4px 9px; border-radius: 5px; background: #f8f7ff; color: #3C3489; cursor: pointer; border: 1px solid #e8e6f8; transition: all 0.12s; font-weight: 500; } .gte-word:hover { background: #EEEDFE; border-color: #AFA9EC; } .gte-word.opaque { border-style: dashed; color: #854F0B; background: #FAEEDA; border-color: #FAC775; } .gte-word.opaque:hover { background: #FAC775; } /* ── Reading Passage ── */ .gte-passage { background: #fff; border: 1px solid #e8e6f8; border-radius: 10px; padding: 18px; margin-bottom: 24px; } .gte-passage h4 { font-size: 13px; font-weight: 700; color: #26215C; margin-bottom: 14px; } .gte-passage-table { width: 100%; border-collapse: collapse; font-size: 13px; } .gte-passage-table th { text-align: left; padding: 8px 10px; font-size: 11px; font-weight: 700; color: #888780; border-bottom: 1px solid #e8e6f8; text-transform: uppercase; letter-spacing: 0.05em; } .gte-passage-table td { padding: 9px 10px; border-bottom: 1px solid #f0eeea; vertical-align: top; line-height: 1.6; } .gte-passage-table tr:last-child td { border-bottom: none; } .gte-passage-table td:first-child { color: #B4B2A9; font-size: 11px; font-weight: 700; width: 28px; } .gte-passage-table td.s1c { color: #3C3489; } .gte-passage-table td.s2c { color: #0F6E56; } .gte-passage-table td.s3c { color: #634808; } /* ── Writing Zone ── */ .gte-writing { background: #fff; border: 1px solid #e8e6f8; border-radius: 10px; padding: 18px; } .gte-writing h4 { font-size: 13px; font-weight: 700; color: #26215C; margin-bottom: 14px; } .gte-slot-row { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; } .gte-slot-label { flex-shrink: 0; font-size: 11px; font-weight: 700; padding: 6px 8px; border-radius: 6px; min-width: 32px; text-align: center; margin-top: 3px; } .gte-slot-label.s1 { background: #EEEDFE; color: #3C3489; } .gte-slot-label.s2 { background: #E1F5EE; color: #0F6E56; } .gte-slot-label.s3 { background: #FAEEDA; color: #854F0B; } .gte-slot-wrap { flex: 1; } .gte-slot-input { width: 100%; border: 1.5px solid #d0cce8; border-radius: 7px; padding: 8px 12px; font-size: 13px; font-family: inherit; color: #1a1a1a; resize: vertical; min-height: 42px; background: #fafafa; transition: border-color 0.15s; } .gte-slot-input:focus { outline: none; border-color: #7F77DD; background: #fff; } .gte-slot-hint { font-size: 11px; color: #888780; margin-top: 4px; line-height: 1.4; } .gte-slot-side { font-size: 11px; color: #888780; padding: 8px 0 0 4px; flex-shrink: 0; max-width: 130px; line-height: 1.4; } .gte-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; } .gte-btn-primary { padding: 9px 18px; background: #3C3489; color: #fff; border: none; border-radius: 7px; font-size: 13px; cursor: pointer; font-family: inherit; font-weight: 600; transition: background 0.15s; } .gte-btn-primary:hover { background: #534AB7; } .gte-btn-primary:disabled { background: #AFA9EC; cursor: wait; } .gte-btn-secondary { padding: 9px 14px; background: #f8f7ff; color: #5F5E5A; border: 1.5px solid #d0cce8; border-radius: 7px; font-size: 13px; cursor: pointer; font-family: inherit; font-weight: 500; } .gte-btn-secondary:hover { background: #EEEDFE; color: #3C3489; } .gte-btn-print { padding: 9px 14px; background: #fff; color: #5F5E5A; border: 1.5px solid #d0cce8; border-radius: 7px; font-size: 13px; cursor: pointer; font-family: inherit; margin-left: auto; } .gte-btn-print:hover { background: #f0eeea; } /* ── Output ── */ .gte-output { margin-top: 14px; padding: 16px; background: #f8f7ff; border-radius: 8px; border: 1px solid #e8e6f8; min-height: 60px; } .gte-output-placeholder { font-size: 13px; color: #B4B2A9; } .gte-output-para { font-size: 14px; line-height: 1.9; } .gte-output-para .s1t { color: #3C3489; font-weight: 500; } .gte-output-para .s2t { color: #0F6E56; font-weight: 500; } .gte-output-para .s3t { color: #854F0B; font-weight: 500; } .gte-ai-response { margin-top: 12px; padding: 14px 16px; background: #fff; border: 1px solid #e8e6f8; border-radius: 8px; border-left: 3px solid #7F77DD; } .gte-ai-label { font-size: 11px; font-weight: 700; color: #7F77DD; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.06em; } .gte-ai-text { font-size: 13px; line-height: 1.7; color: #26215C; white-space: pre-wrap; } .gte-loading { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #7F77DD; } .gte-dot { width: 6px; height: 6px; border-radius: 50%; background: #7F77DD; animation: gte-pulse 1.2s ease-in-out infinite; } .gte-dot:nth-child(2) { animation-delay: 0.2s; } .gte-dot:nth-child(3) { animation-delay: 0.4s; } @keyframes gte-pulse { 0%,80%,100%{opacity:0.2;transform:scale(0.8)} 40%{opacity:1;transform:scale(1)} } /* ── Footer ── */ .gte-footer { margin-top: 28px; padding: 16px 0; border-top: 1px solid #e8e6f8; display: flex; align-items: center; justify-content: space-between; flex-wrap: gap; } .gte-footer-text { font-size: 11px; color: #B4B2A9; } .gte-footer-badge { font-size: 11px; color: #7F77DD; font-weight: 600; } /* ── Responsive ── */ @media (max-width: 600px) { .gte-hero { padding: 24px 18px; } .gte-hero h1 { font-size: 22px; } .gte-matrix { grid-template-columns: 20px 1fr; } .gte-matrix-header:nth-child(3), .gte-matrix-header:nth-child(4) { display: none; } .gte-cell.s2, .gte-cell.s3 { display: none; } .gte-slot-side { display: none; } .gte-hero-stats { gap: 16px; } } @media print { .gte-nav, .gte-actions, .gte-word-banks, .gte-hero { display: none; } .gte-matrix { page-break-inside: avoid; } }
Reading & Writing System · Pre-K through 6th Grade

Gopher Telos Engine

A mechanical scaffolding system for dyslexic and developing readers. Built on the 3×7 Syntactic Matrix — three tiers of sentence complexity across seven story beats. Start in the shallow water. Navigate to the deep.

7
Grade levels
3×7
Syntax matrix
300+
Curated words
AI
Live feedback
(function() { // ── CONFIG — REPLACE THIS WITH YOUR ANTHROPIC API KEY ── var API_KEY = ‘YOUR_API_KEY_HERE’; // ── DATA ── var LEVELS = [ { id:0, grade:”Reading Age”, emoji:”🌱”, abbr:”RA”, subtitle:”Pre-K – Kindergarten · Ages 4–6″, desc:”First exposure to the Syntax Engine. All words are CVC — every letter makes one sound, no exceptions. The 3×7 matrix is introduced using only three slots.”, tags:[[“CVC only”,”purple”],[“Zero opaque words”,”teal”],[“Oral-first”,”amber”]], depth:5, wordBanks:[ {title:”Nouns (things)”,words:[“cat”,”dog”,”sun”,”pig”,”bed”,”hen”,”log”,”pot”,”cup”,”cap”,”net”,”wig”,”van”,”bug”,”lip”,”rug”,”jug”,”mop”,”bun”,”fin”],opaque:[]}, {title:”Verbs (actions)”,words:[“ran”,”sat”,”bit”,”hop”,”dug”,”hid”,”lit”,”pat”,”sip”,”tap”,”wag”,”nap”,”beg”,”nod”,”rub”,”sob”,”jab”,”peg”,”tug”,”zip”],opaque:[]}, {title:”Anchors (⚠️ opaque)”,words:[“the”,”and”,”a”,”is”],opaque:[“the”,”and”,”a”,”is”]} ], matrix:[ [“The cat sat.”,”The dog ran fast.”,”Because the sun was hot, the mud was wet.”], [“The pig bit.”,”The bug hid well.”,”When the hen lit up, the fog was thin.”], [“A cup fell.”,”The cap fit tight.”,”Since the net was big, the fish got out.”], [“The wig slid.”,”A van sat still.”,”After the jug tipped, the log was wet.”], [“The lip cut.”,”A rug sat flat.”,”If the pot was red, the cup was not.”], [“The mop slid.”,”A bun sat hot.”,”While the van ran, the dog sat up.”], [“The dog napped.”,”The hen sat still.”,”Because the cat ran back, the sun set red.”] ], hints:[“S1: Who + did what? (3 words max)”,”S2: S1, and + a second idea”,”S3: Because / When / Since — then the result”] }, { id:1, grade:”1st Grade”, emoji:”🔧”, abbr:”G1″, subtitle:”Grade 1 · Ages 6–7″, desc:”Blend gears (frog, stop, spin) and Silent-E words enter. 10 anchor words from the Dolch list used as fixed structure pieces — marked opaque so readers learn they are special.”, tags:[[“Blends + Silent-E”,”purple”],[“10 fixed anchors”,”teal”],[“3×7 full matrix”,”amber”]], depth:20, wordBanks:[ {title:”Nouns”,words:[“frog”,”drum”,”flag”,”plum”,”gate”,”lake”,”note”,”cave”,”robe”,”bike”,”step”,”grip”,”crab”,”clam”,”flap”,”blob”,”slab”,”grim”,”snap”,”clan”],opaque:[]}, {title:”Verbs”,words:[“jump”,”lift”,”swim”,”melt”,”hunt”,”drift”,”climb”,”twist”,”grab”,”slip”,”clap”,”drop”,”flip”,”snap”,”stomp”,”stamp”,”spent”,”blend”,”crust”,”skunk”],opaque:[]}, {title:”Adjectives”,words:[“big”,”red”,”hot”,”wet”,”old”,”flat”,”slim”,”soft”,”long”,”dark”,”cold”,”fast”,”thin”,”firm”,”bold”,”glad”,”tame”,”wild”,”dull”,”grim”],opaque:[]}, {title:”Anchors (⚠️ opaque)”,words:[“the”,”and”,”was”,”his”,”but”,”not”,”with”,”had”,”for”,”are”],opaque:[“the”,”and”,”was”,”his”,”but”,”not”,”with”,”had”,”for”,”are”]} ], matrix:[ [“The frog jumped.”,”The drum was loud, and the flag waved.”,”Because the gate was shut, the frog leaped back.”], [“The crab crept.”,”The lake was cold, and the note was lost.”,”While the cave was dark, the boy crept inside.”], [“The dog swam.”,”The grip was firm, and the robe was damp.”,”When the rock fell, the dog swam fast and hard.”], [“A plum fell.”,”The step was slick, and the mud was thick.”,”Since the spin was fast, the top did not stop.”], [“The bike spun.”,”The stamp was red, and the slot was slim.”,”After the drum beat, the flag was lifted up.”], [“The blob dripped.”,”The clam was shut, and the rock was flat.”,”If the snap was loud, the crab would hide deep.”], [“The boy climbed.”,”The frog was glad, and the plum was ripe.”,”Because the bike was fast, Cyrus rode to the gate.”] ], hints:[“S1: Subject + verb + optional object”,”S2: S1, and + second clause — same length!”,”S3: Because / While / When / Since / After / If — then the result”] }, { id:2, grade:”2nd Grade”, emoji:”⚙️”, abbr:”G2″, subtitle:”Grade 2 · Ages 7–8″, desc:”Two-syllable transparent words enter the matrix (sunset, laptop, velvet). Subordinating conjunctions are drilled as ‘logic gears.’ Readers see S3 as a gear shift, not a barrier.”, tags:[[“2-syllable words”,”purple”],[“Logic-gear conjunctions”,”teal”],[“S1→S3 fluency”,”amber”]], depth:35, wordBanks:[ {title:”Nouns”,words:[“sunset”,”laptop”,”dustpan”,”cactus”,”velvet”,”fabric”,”mascot”,”tablet”,”dentist”,”goblin”,”picnic”,”napkin”,”plastic”,”helmet”,”insect”,”blanket”,”basket”,”muffin”,”combat”,”problem”],opaque:[]}, {title:”Verbs”,words:[“melted”,”hunted”,”drifted”,”climbed”,”twisted”,”stamped”,”lifted”,”blinked”,”hummed”,”snapped”,”cracked”,”floated”,”blasted”,”planted”,”tracked”,”pinched”,”gripped”,”printed”,”slipped”,”stacked”],opaque:[]}, {title:”Adjectives”,words:[“velvet”,”slippery”,”golden”,”brittle”,”tangled”,”distant”,”jagged”,”scattered”,”mossy”,”dusty”,”hollow”,”narrow”,”sunlit”,”frozen”,”battered”,”tattered”,”frantic”,”lanky”,”murky”,”lofty”],opaque:[]}, {title:”Anchors (⚠️ opaque)”,words:[“was”,”were”,”have”,”said”,”there”,”their”,”many”,”could”,”would”,”should”],opaque:[“was”,”were”,”have”,”said”,”there”,”their”,”many”,”could”,”would”,”should”]} ], matrix:[ [“The cactus bent.”,”The velvet was soft, and the tablet was flat.”,”Because the dustpan was cracked, the goblin dropped it.”], [“The insect hummed.”,”The helmet was old, and the basket was full.”,”When the sunset faded, the insects hummed in the dark.”], [“The blanket slipped.”,”The muffin was golden, and the picnic was set.”,”While the goblin crept, the fabric twisted in the cold wind.”], [“The laptop blinked.”,”The problem was solved, and the dentist smiled wide.”,”Since the plastic cracked, the mascot fell from the top shelf.”], [“A blossom drifted.”,”The sunset was golden, and the dusk was very still.”,”After the insects scattered, the picnic basket was left behind.”], [“The helmet cracked.”,”The blanket was tattered, and the goblin was very lost.”,”If the tablet blinked twice, the system had found the signal.”], [“The boy tracked it.”,”The dustpan was full, and the napkin was still damp.”,”Because the problem was solved, Cyrus felt the engine click and lock.”] ], hints:[“S1: Use a 2-syllable noun as your subject”,”S2: ‘, and’ connects two equal-weight ideas”,”S3: Logic gear first (Because/When/While/Since/After/If), then the effect”] }, { id:3, grade:”3rd Grade”, emoji:”🗝️”, abbr:”G3″, subtitle:”Grade 3 · Ages 8–9″, desc:”Opaque words enter deliberately and are labelled — readers learn that some words are ‘irregular gears.’ The matrix now carries a micro-story arc across all 7 rows.”, tags:[[“Opaque words labelled”,”purple”],[“Micro-story arc”,”teal”],[“300+ word vocab”,”amber”]], depth:50, wordBanks:[ {title:”Nouns”,words:[“signal”,”mission”,”circuit”,”engine”,”lantern”,”compass”,”vessel”,”pattern”,”harbor”,”canyon”,”timber”,”falcon”,”mirror”,”shadow”,”current”,”riddle”,”crystal”,”labyrinth”,”chimney”,”fortress”],opaque:[]}, {title:”Verbs”,words:[“carried”,”followed”,”shattered”,”gathered”,”unfolded”,”discovered”,”threaded”,”connected”,”ignited”,”revealed”,”scattered”,”balanced”,”vanished”,”constructed”,”navigated”,”collapsed”,”emerged”,”whispered”,”suspended”,”multiplied”],opaque:[]}, {title:”⚠️ Opaque (special gears)”,words:[“water”,”people”,”said”,”through”,”would”,”could”,”where”,”their”,”many”,”should”,”once”,”again”,”always”,”never”,”every”,”often”,”which”,”whose”,”other”,”because”],opaque:[“water”,”people”,”said”,”through”,”would”,”could”,”where”,”their”,”many”,”should”,”once”,”again”,”always”,”never”,”every”,”often”,”which”,”whose”,”other”,”because”]} ], matrix:[ [“The signal blinked.”,”The lantern was lit, and the compass pointed west.”,”Because the signal blinked, Cyrus followed the hidden path.”], [“A vessel drifted.”,”The harbor was calm, and the current was very strong.”,”When the vessel drifted, the crew gathered the heavy sails.”], [“The mirror shattered.”,”The riddle was carved, and the crystal was bitterly cold.”,”While the mirror shattered, the shadow on the wall began moving.”], [“A falcon circled.”,”The canyon was deep, and the timber was centuries old.”,”Since the falcon circled, they knew the fortress must be near.”], [“The chimney smoked.”,”The pattern was woven, and the circuit was now complete.”,”After the chimney smoked, the engine began its slow hum.”], [“The labyrinth turned.”,”The compass spun wildly, and the lantern almost went out.”,”If they followed the thread, the labyrinth would not hold them.”], [“The engine sang.”,”The signal was clear, and the mission was finally done.”,”Because the circuit connected, Cyrus found the way through the dark.”] ], hints:[“S1: Strong 2+ syllable noun as subject”,”S2: Two balanced ideas — equal weight on each side of ‘, and'”,”S3: Opaque connector + consequence. Note: ‘because’ is a special gear!”] }, { id:4, grade:”4th Grade”, emoji:”🌊”, abbr:”G4″, subtitle:”Grade 4 · Ages 9–10″, desc:”The deep water begins. Opaque words are used freely but the 3×7 matrix holds firm. Abstract nouns enter. Readers see that the Syntax Rail keeps them safe even as vocabulary gets turbulent.”, tags:[[“Free opaque vocab”,”purple”],[“Abstract nouns”,”teal”],[“Structural fluency”,”amber”]], depth:65, wordBanks:[ {title:”Abstract nouns”,words:[“courage”,”knowledge”,”patience”,”freedom”,”justice”,”memory”,”doubt”,”wisdom”,”grief”,”ambition”,”loyalty”,”silence”,”rhythm”,”tension”,”harmony”,”solitude”,”conflict”,”momentum”,”intuition”,”legacy”],opaque:[]}, {title:”Verbs (literary)”,words:[“pursued”,”questioned”,”surrendered”,”endured”,”transformed”,”awakened”,”confronted”,”protected”,”challenged”,”constructed”,”reflected”,”abandoned”,”restored”,”calculated”,”distinguished”,”overwhelmed”,”sustained”,”anticipated”,”balanced”,”complicated”],opaque:[]}, {title:”Deep connectors (⚠️)”,words:[“therefore”,”however”,”although”,”despite”,”unless”,”whether”,”whenever”,”wherever”,”whoever”,”meanwhile”,”otherwise”,”consequently”,”furthermore”,”nevertheless”,”accordingly”,”subsequently”,”simultaneously”,”additionally”,”alternatively”,”nonetheless”],opaque:[“therefore”,”however”,”although”,”despite”,”unless”,”whether”,”whenever”,”wherever”,”whoever”,”meanwhile”,”otherwise”,”consequently”,”furthermore”,”nevertheless”,”accordingly”,”subsequently”,”simultaneously”,”additionally”,”alternatively”,”nonetheless”]} ], matrix:[ [“Courage faltered.”,”Silence filled the room, and tension gripped the crowd.”,”Although courage faltered, the boy did not step back at all.”], [“Memory faded.”,”Knowledge was lost, and doubt moved in to replace it.”,”When memory faded, the rhythm of the old engine returned.”], [“Wisdom endured.”,”Patience built the bridge, and justice was first to cross.”,”While wisdom endured, conflict kept rising up all around them.”], [“Loyalty held.”,”Ambition drove him forward, and momentum carried the rest along.”,”Since loyalty held, the harmony of the whole system was restored.”], [“Solitude deepened.”,”Grief was carried forward, and legacy was built carefully from it.”,”After solitude deepened, intuition finally began to speak with clarity.”], [“Tension broke.”,”Freedom appeared at last, and the rhythm of the world changed.”,”Despite the tension, Cyrus held the circuit firmly in both hands.”], [“The engine locked.”,”The syntax was clear, and the deep water finally grew calm.”,”Because the matrix held, Cyrus walked through the darkness completely free.”] ], hints:[“S1: Use an abstract noun as the subject — no article needed!”,”S2: Two abstract ideas joined by ‘, and’ — both must be equal weight”,”S3: Use a deep connector — these are complex gears that change meaning”] }, { id:5, grade:”5th Grade”, emoji:”🌐”, abbr:”G5″, subtitle:”Grade 5 · Ages 10–11″, desc:”Multi-clause sentences. Readers use the matrix as a diagnostic tool — identifying where a complex sentence ‘lives’ in the S1/S2/S3 system. Writing now includes embedded relative clauses.”, tags:[[“Relative clauses”,”purple”],[“Diagnostic reading”,”teal”],[“Full orthographic depth”,”amber”]], depth:80, wordBanks:[ {title:”Sophisticated nouns”,words:[“phenomenon”,”symmetry”,”trajectory”,”momentum”,”threshold”,”paradigm”,”sovereignty”,”culmination”,”infrastructure”,”consequence”,”revelation”,”catastrophe”,”equilibrium”,”expedition”,”persistence”,”chronicle”,”synthesis”,”blueprint”,”hypothesis”,”algorithm”],opaque:[]}, {title:”Relative clause starters (⚠️)”,words:[“who”,”which”,”that”,”whose”,”where”,”when”,”whom”],opaque:[“who”,”which”,”that”,”whose”,”where”,”when”,”whom”]}, {title:”Clause constructions”,words:[“The [noun] that [verb]…”,”A [noun], which [verb]…”,”[Noun], whose [noun] [verb]…”,”The place where [clause]…”,”The moment when [clause]…”],opaque:[]} ], matrix:[ [“The algorithm ran.”,”The blueprint was drafted, and the hypothesis was tested carefully.”,”Although the phenomenon was rare, the data revealed a pattern no one expected.”], [“The threshold shifted.”,”The equilibrium broke suddenly, and the whole trajectory changed its course.”,”When the threshold shifted, every system that depended on it collapsed together.”], [“The chronicle ended.”,”The expedition returned at last, and the synthesis was finally complete.”,”Since the chronicle ended, the paradigm that had guided them for years was gone.”], [“The revelation spread.”,”The infrastructure held firm, and the consequence was carefully managed.”,”While the revelation spread, the sovereignty that had protected it was questioned.”], [“Momentum gathered.”,”The culmination arrived without warning, and persistence finally began to pay off.”,”After momentum gathered, the catastrophe that everyone had feared was narrowly avoided.”], [“The symmetry broke.”,”The blueprint that Cyrus had built was tested under pressure, and it held.”,”Despite the catastrophe, the algorithm, which no one had trusted, was the one that survived.”], [“The engine was whole.”,”The hypothesis was proved at last, and the syntax was complete and clear.”,”Because the paradigm had shifted, Cyrus, whose mind was the engine, was finally free.”] ], hints:[“S1: Sophisticated noun — let it carry the sentence alone”,”S2: Notice how clauses in S2 can now contain embedded ideas”,”S3: Relative clause check — find the who/which/that inside your S3″] }, { id:6, grade:”6th Grade”, emoji:”🏆”, abbr:”G6″, subtitle:”Grade 6 · Ages 11–12″, desc:”Full academic writing. The student uses the 3×7 as a diagnostic audit tool — mapping any paragraph they encounter back to the matrix. The engine is now internalized.”, tags:[[“Academic register”,”purple”],[“Matrix as diagnostic”,”teal”],[“Syntax internalized”,”amber”]], depth:95, wordBanks:[ {title:”Academic vocabulary”,words:[“civilization”,”democracy”,”perspective”,”economic”,”consequence”,”evidence”,”analysis”,”argument”,”hypothesis”,”variable”,”correlation”,”causation”,”inference”,”interpretation”,”transformation”,”adaptation”,”innovation”,”legislation”,”sovereignty”,”infrastructure”],opaque:[]}, {title:”Rhetorical structures”,words:[“Furthermore, [claim]”,”However, [counterargument]”,”In contrast, [alternative]”,”As a result, [consequence]”,”Nevertheless, [concession]”,”In particular, [emphasis]”,”For instance, [example]”,”Consequently, [effect]”,”Despite [obstacle], [result]”,”To illustrate, [example]”],opaque:[]}, {title:”Diagnostic prompts”,words:[“Find the S1 core”,”Label the S2 connector”,”Name the S3 trigger”,”Identify embedded clause”,”Map sentence to matrix”,”Rewrite as S1 only”,”Expand S1 into S3″,”Strip to noun + verb”],opaque:[]} ], matrix:[ [“Democracy requires evidence.”,”Civilization transforms slowly, and legislation often lags far behind.”,”Although democracy requires evidence, public opinion can override careful analysis.”], [“Perspectives shift.”,”Economic consequence shapes all policy, and innovation drives every adaptation.”,”When perspectives shift, the primary sources that scholars trust become deeply contested.”], [“Causation is debated.”,”Correlation suggests a pattern, and hypothesis shapes what we choose to look for.”,”Since causation is debated, every inference drawn from any variable must be challenged.”], [“Arguments evolve.”,”Evidence accumulates gradually over time, and interpretation changes with each generation.”,”While arguments evolve, the secondary sources that frame them carry hidden and persistent bias.”], [“Innovation disrupts.”,”Transformation accelerates change rapidly, and adaptation determines who ultimately survives it.”,”After innovation disrupts, the civilization that adapted earliest holds the most enduring power.”], [“Legislation responds.”,”The consequence was measured precisely, and the analysis pointed to a single root cause.”,”Despite the legislation, the economic variable that no one had tracked had already shifted first.”], [“The matrix holds.”,”The engine is fully internalized, and the syntax now guides every sentence Cyrus writes.”,”Because Cyrus learned the system, every text he encounters can be mapped, decoded, and mastered.”] ], hints:[“S1: Strip any complex sentence to its S1 core. Subject + verb = the engine.”,”S2: Label the connector. Is it ‘, and’? ‘; however,’? That tells you the relationship.”,”S3: Name the trigger word — causal (because/since), temporal (when/after), or concessive (although/despite)?”] } ]; var currentLevel = 0; // ── RENDER NAVIGATION ── function renderNav() { var nav = document.getElementById(‘gte-nav’); nav.innerHTML = LEVELS.map(function(L) { return ‘‘; }).join(”); } // ── RENDER DEPTH BAR ── function renderDepth(depth) { var color = depth < 30 ? '#1D9E75' : depth < 60 ? '#EF9F27' : '#D85A30'; return '
‘ + ‘Orthographic depth‘ + ‘
‘ + ‘‘ + depth + ‘%‘ + ‘
‘; } // ── RENDER LEVEL HEADER ── function renderHeader(L) { var tagColors = {purple:’gte-tag-purple’,teal:’gte-tag-teal’,amber:’gte-tag-amber’}; var tags = L.tags.map(function(t){ return ‘‘ + t[0] + ‘‘; }).join(”); return ‘
‘ + ‘
‘ + L.emoji + ‘
‘ + ‘
‘ + ‘

‘ + L.grade + ‘

‘ + ‘
‘ + L.subtitle + ‘
‘ + ‘
‘ + L.desc + ‘
‘ + ‘
‘ + tags + ‘
‘ + ‘
‘; } // ── RENDER MATRIX ── function renderMatrix(matrix) { var rows = matrix.map(function(row, i) { return ‘
‘ + (i+1) + ‘
‘ + ‘
‘ + row[0] + ‘
click → S1
‘ + ‘
‘ + row[1] + ‘
click → S2
‘ + ‘
‘ + row[2] + ‘
click → S3
‘; }).join(”); return ‘‘ + ‘
‘ + ‘
S1 Simple
‘ + ‘
S2 Compound
‘ + ‘
S3 Complex
‘ + ‘
‘ + ‘
‘ + ‘
S1 — Simple
‘ + ‘
S2 — Compound
‘ + ‘
S3 — Complex
‘ + rows + ‘
‘; } // ── RENDER WORD BANKS ── function renderWordBanks(banks) { var html = ‘
‘; banks.forEach(function(b) { html += ‘

‘ + b.title + ‘

‘; b.words.forEach(function(w) { var isOpaque = b.opaque.indexOf(w) > -1; html += ‘‘ + w + ‘‘; }); html += ‘
‘; }); return html + ‘
‘; } // ── RENDER WRITING ZONE ── function renderWriting(hints) { return ‘‘ + ‘
‘ + ‘

Write one sentence in each slot, then click “Get AI feedback”

‘ + ‘
S1
‘ + hints[0] + ‘
‘ + ‘
S2
‘ + hints[1] + ‘
‘ + ‘
S3
‘ + hints[2] + ‘
‘ + ‘
‘ + ‘‘ + ‘‘ + ‘‘ + ‘
‘ + ‘
Your paragraph and AI feedback will appear here…
‘ + ‘
‘; } // ── SHOW LEVEL ── window.gteShowLevel = function(id) { currentLevel = id; renderNav(); var L = LEVELS[id]; var html = renderHeader(L) + renderDepth(L.depth) + renderMatrix(L.matrix) + renderWordBanks(L.wordBanks) + renderWriting(L.hints); document.getElementById(‘gte-content’).innerHTML = html; setTimeout(function(){ var fill = document.getElementById(‘gte-depth-fill’); if (fill) fill.style.width = L.depth + ‘%’; }, 50); }; // ── COPY TO SLOT ── window.gteCopySlot = function(slot, text) { var ids = [‘gte-s1′,’gte-s2′,’gte-s3’]; var el = document.getElementById(ids[slot]); if (el) { el.value = text; el.focus(); } }; // ── INSERT WORD ── window.gteInsertWord = function(word) { var focused = document.activeElement; var slots = [‘gte-s1′,’gte-s2′,’gte-s3’]; var target = null; if (focused && slots.indexOf(focused.id) > -1) { target = focused; } else { target = document.getElementById(‘gte-s1’); } if (!target) return; var v = target.value; var sep = (v && v.slice(-1) !== ‘ ‘) ? ‘ ‘ : ”; target.value = v + sep + word; target.focus(); }; // ── CLEAR ALL ── window.gteClearAll = function() { [‘gte-s1′,’gte-s2′,’gte-s3’].forEach(function(id){ var el = document.getElementById(id); if (el) el.value = ”; }); var out = document.getElementById(‘gte-output’); if (out) out.innerHTML = ‘
Your paragraph and AI feedback will appear here…
‘; }; // ── AI FEEDBACK ── window.gteGetFeedback = function() { var s1 = (document.getElementById(‘gte-s1’)||{}).value||”; var s2 = (document.getElementById(‘gte-s2’)||{}).value||”; var s3 = (document.getElementById(‘gte-s3’)||{}).value||”; s1 = s1.trim(); s2 = s2.trim(); s3 = s3.trim(); if (!s1 && !s2 && !s3) { alert(‘Please write at least one sentence first.’); return; } var out = document.getElementById(‘gte-output’); var btn = document.getElementById(‘gte-ai-btn’); // Show paragraph preview var paraHtml = ‘

‘; if (s1) paraHtml += ‘‘ + s1 + ‘ ‘; if (s2) paraHtml += ‘‘ + s2 + ‘ ‘; if (s3) paraHtml += ‘‘ + s3 + ‘‘; paraHtml += ‘

‘; out.innerHTML = paraHtml + ‘
‘ + ‘
Gopher Telos AI Feedback
‘ + ‘
Analyzing your sentences…
‘ + ‘
‘; btn.disabled = true; btn.textContent = ‘Analyzing…’; var L = LEVELS[currentLevel]; var prompt = ‘You are a warm, encouraging literacy coach using the Gopher Telos Engine — a 3×7 Syntactic Matrix system based on Orthographic Depth research. The student is working at ‘ + L.grade + ‘ level (‘ + L.subtitle + ‘).\n\nThe student wrote these sentences:\nS1 (Simple): “‘ + (s1||'[blank]’) + ‘”\nS2 (Compound): “‘ + (s2||'[blank]’) + ‘”\nS3 (Complex): “‘ + (s3||'[blank]’) + ‘”\n\nPlease give brief, encouraging feedback in exactly this format:\n✓ S1 check: [one sentence — does it have a clear subject + verb?]\n✓ S2 check: [one sentence — does it use \’, and\’ to join two equal ideas?]\n✓ S3 check: [one sentence — does it open with a logic-gear conjunction like Because/When/While/Since/After/If/Although?]\n💡 One tip: [one specific, actionable suggestion to strengthen any of the three sentences]\n⭐ Encouragement: [one sentence of genuine praise for what they did well]\n\nKeep the total response under 120 words. Be warm and specific.’; fetch(‘https://api.anthropic.com/v1/messages&#8217;, { method: ‘POST’, headers: { ‘Content-Type’: ‘application/json’, ‘x-api-key’: API_KEY, ‘anthropic-version’: ‘2023-06-01’, ‘anthropic-dangerous-direct-browser-access’: ‘true’ }, body: JSON.stringify({ model: ‘claude-sonnet-4-6’, max_tokens: 300, messages: [{ role: ‘user’, content: prompt }] }) }) .then(function(r){ return r.json(); }) .then(function(data){ btn.disabled = false; btn.textContent = ‘Get AI feedback ✦’; var text = ”; if (data && data.content && data.content[0]) { text = data.content[0].text || ”; } else if (data && data.error) { text = ‘Error: ‘ + data.error.message; } var aiBox = out.querySelector(‘.gte-ai-response’); if (aiBox) { aiBox.innerHTML = ‘
Gopher Telos AI Feedback
‘ + text.replace(//g,’>’) + ‘
‘; } }) .catch(function(err){ btn.disabled = false; btn.textContent = ‘Get AI feedback ✦’; var aiBox = out.querySelector(‘.gte-ai-response’); if (aiBox) { aiBox.innerHTML = ‘
Gopher Telos AI Feedback
Could not connect to AI. Please check your API key in the code, or try again.
‘; } }); }; // ── ESCAPE HELPER ── function esc(str) { return str.replace(/\\/g,’\\\\’).replace(/’/g,”\\'”); } // ── INIT ── window.gteShowLevel(0); })();