| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"/> |
| <meta name="viewport" content="width=device-width, initial-scale=1"/> |
| <title>Runtime / Browser / HIR Shield Stack</title> |
| <meta name="description" content="Agency-gated browser runtime map."/> |
| <style> |
| :root{ |
| --bg:#060711;--bg2:#0f1230;--panel:rgba(255,255,255,.075);--ink:#f7f1ff;--muted:#cbc1e5;--dim:#9388b2; |
| --purple:#a05cff;--indigo:#4c5bff;--cyan:#70e8ff;--gold:#ffd27a;--green:#7dffad;--red:#ff6b8a;--yellow:#ffe07a; |
| --line:rgba(203,177,255,.22);--line2:rgba(112,232,255,.32);--radius:26px;--shadow:0 28px 100px rgba(0,0,0,.46); |
| } |
| *{box-sizing:border-box} |
| html{scroll-behavior:smooth} |
| body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;min-height:100vh;overflow-x:hidden; |
| background: |
| radial-gradient(circle at 18% 0%, rgba(160,92,255,.30), transparent 29rem), |
| radial-gradient(circle at 88% 10%, rgba(112,232,255,.19), transparent 28rem), |
| radial-gradient(circle at 48% 94%, rgba(255,210,122,.10), transparent 36rem), |
| linear-gradient(135deg,var(--bg),var(--bg2) 55%,#050611);} |
| .gridbg,.scan,.glow{position:fixed;inset:0;pointer-events:none} |
| .gridbg{opacity:.14;background: |
| linear-gradient(90deg,transparent 0 48px,rgba(255,255,255,.13) 49px,transparent 50px), |
| linear-gradient(0deg,transparent 0 48px,rgba(255,255,255,.10) 49px,transparent 50px); |
| background-size:50px 50px;mask-image:linear-gradient(to bottom,transparent,black 13%,black 82%,transparent)} |
| .scan:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 9px,rgba(112,232,255,.055) 10px,transparent 11px);opacity:.45} |
| .glow:before,.glow:after{content:"";position:absolute;width:42vw;height:8vw;background:linear-gradient(90deg,transparent,rgba(112,232,255,.28),transparent);filter:blur(8px);top:13%;right:-12%;border-radius:999px;transform:rotate(-13deg)} |
| .glow:after{top:68%;left:-12%;right:auto;background:linear-gradient(90deg,transparent,rgba(160,92,255,.24),transparent);transform:rotate(18deg)} |
| .wrap{width:min(1160px,calc(100% - 34px));margin:0 auto;position:relative} |
| header{padding:76px 0 38px} |
| .kicker{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line2);background:rgba(255,255,255,.075);border-radius:999px;padding:9px 13px;color:#dff9ff;text-transform:uppercase;font-size:12px;letter-spacing:.16em;font-weight:850;backdrop-filter:blur(14px)} |
| .dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 25px var(--green)} |
| h1{font-size:clamp(40px,7.2vw,88px);line-height:.94;letter-spacing:-.07em;margin:24px 0 18px;max-width:1080px} |
| h1 span{background:linear-gradient(90deg,#fff,var(--cyan),var(--purple),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent} |
| .sub{font-size:clamp(17px,2.1vw,23px);color:var(--muted);max-width:1000px;margin:0} |
| .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px} |
| .btn{color:var(--ink);text-decoration:none;border:1px solid rgba(112,232,255,.28);background:linear-gradient(135deg,rgba(112,232,255,.13),rgba(160,92,255,.16));padding:12px 16px;border-radius:15px;font-weight:850;box-shadow:0 16px 50px rgba(0,0,0,.22)} |
| .btn.secondary{background:rgba(255,255,255,.055);color:var(--muted)} |
| nav{position:sticky;top:0;z-index:20;background:rgba(6,7,17,.74);border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px)} |
| nav .wrap{display:flex;gap:8px;overflow:auto;padding:11px 0} |
| nav a{white-space:nowrap;text-decoration:none;color:var(--muted);border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.045);padding:8px 11px;border-radius:999px;font-size:13px} |
| section{padding:52px 0} |
| h2{font-size:clamp(28px,4vw,44px);line-height:1.05;letter-spacing:-.045em;margin:0 0 10px} |
| .lead{color:var(--muted);max-width:900px;font-size:17px;margin:0 0 22px} |
| .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px} |
| @media(max-width:920px){.grid{grid-template-columns:repeat(2,1fr)}} |
| @media(max-width:650px){.grid{grid-template-columns:1fr}} |
| .card,.panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.088),rgba(255,255,255,.038));border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;position:relative;overflow:hidden} |
| .card:before,.panel:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,var(--accent,var(--cyan)),transparent);opacity:.8} |
| .icon{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;font-size:24px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)} |
| .top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px} |
| .pill{font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:5px 8px;color:var(--dim);background:rgba(0,0,0,.18)} |
| .green{color:var(--green);border-color:rgba(125,255,173,.35)} .yellow{color:var(--yellow);border-color:rgba(255,224,122,.35)} .red{color:var(--red);border-color:rgba(255,107,138,.35)} |
| h3{font-size:21px;line-height:1.14;margin:0 0 8px;letter-spacing:-.02em} |
| p{color:var(--muted)} |
| .card p{font-size:14.5px;margin:0} |
| .tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px} |
| .tag{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border:1px solid rgba(255,255,255,.12);padding:5px 7px;border-radius:999px;background:rgba(255,255,255,.045)} |
| .split{display:grid;grid-template-columns:1fr 1fr;gap:16px} |
| @media(max-width:820px){.split{grid-template-columns:1fr}} |
| .equation{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;border:1px solid rgba(112,232,255,.22);background:rgba(0,0,0,.26);border-left:4px solid var(--cyan);border-radius:18px;padding:16px;color:#eaffff;overflow:auto;margin:12px 0;white-space:pre-wrap} |
| .warn{border:1px solid rgba(255,210,122,.32);border-left:5px solid var(--gold);background:rgba(255,210,122,.09);border-radius:0 24px 24px 0;padding:22px} |
| .danger{border:1px solid rgba(255,107,138,.32);border-left:5px solid var(--red);background:rgba(255,107,138,.09);border-radius:0 24px 24px 0;padding:22px} |
| .links{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px} |
| .links a{color:var(--ink);text-decoration:none;font-size:13px;font-weight:850;border:1px solid rgba(255,255,255,.14);padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.06)} |
| footer{padding:34px 0 70px;color:var(--dim);border-top:1px solid rgba(255,255,255,.14);margin-top:30px} |
| footer a{color:var(--cyan)} |
| </style> |
| </head> |
| <body> |
| <div class="gridbg"></div><div class="scan"></div><div class="glow"></div> |
|
|
| <header class="wrap"> |
| <div class="kicker"><span class="dot"></span> Runtime / Browser / HIR Shield · v0.1.3 prototype branch</div> |
| <h1>Primordial Browser is not just a privacy browser. <span>It is an agency browser.</span></h1> |
| <p class="sub">A public landing Space for the pre-validation Electron/Chromium browser-shell prototype with HIR/OAM runtime gates, Shield mode, RED hard-stop behavior, and hash-chained audit logging.</p> |
| <div class="actions"> |
| <a class="btn" href="#prototype">Prototype map</a> |
| <a class="btn secondary" href="#boundary">Read boundary</a> |
| <a class="btn secondary" href="https://huggingface.co/spaces/HirModel/primordial-code-ecosystem" target="_blank" rel="noopener">Parent hub</a> |
| </div> |
| </header> |
|
|
| <nav> |
| <div class="wrap"> |
| <a href="#prototype">Prototype</a> |
| <a href="#gates">Runtime gates</a> |
| <a href="#proof">Proof-of-wiring</a> |
| <a href="#files">Files</a> |
| <a href="#boundary">Boundary</a> |
| </div> |
| </nav> |
|
|
| <main> |
| <section class="wrap" id="prototype"> |
| <h2>Runtime interface branch</h2> |
| <p class="lead">This branch is about the user-facing runtime surface: a browser shell that evaluates pressure, consent, manipulation, storage, permissions, and navigation through HIR/OAM gates.</p> |
| <div class="grid"> |
| <article class="card" style="--accent:#7dffad"><div class="top"><div class="icon">🟢</div><span class="pill green">GREEN</span></div><h3>Clean signal</h3><p>Normal navigation, low pressure, no obvious coercion, and auditable behavior remain allowed.</p><div class="tags"><span class="tag">clean</span><span class="tag">auditable</span></div></article> |
| <article class="card" style="--accent:#ffe07a"><div class="top"><div class="icon">🟡</div><span class="pill yellow">YELLOW</span></div><h3>Uncertainty / pressure</h3><p>Elevated uncertainty, persuasive pressure, or unresolved context should trigger caution, explanation, and review.</p><div class="tags"><span class="tag">uncertainty</span><span class="tag">review</span></div></article> |
| <article class="card" style="--accent:#ff6b8a"><div class="top"><div class="icon">🔴</div><span class="pill red">RED</span></div><h3>Hard-stop pressure</h3><p>Manipulation, agency capture, scam pressure, or unsafe coercion crosses threshold and triggers boundary enforcement.</p><div class="tags"><span class="tag">hard stop</span><span class="tag">shield</span></div></article> |
| <article class="card" style="--accent:#70e8ff"><div class="top"><div class="icon">📜</div><span class="pill">Audit</span></div><h3>Hash-chained log</h3><p>Runtime events are designed to be recorded into a tamper-aware audit chain for review and provenance.</p><div class="tags"><span class="tag">audit</span><span class="tag">hash chain</span></div></article> |
| <article class="card" style="--accent:#a05cff"><div class="top"><div class="icon">🛡️</div><span class="pill">Shield</span></div><h3>Shield mode</h3><p>A stronger user-protection posture for manipulative pages, scam pressure, identity-theft pressure, and unsafe flow.</p><div class="tags"><span class="tag">agency</span><span class="tag">defense</span></div></article> |
| <article class="card" style="--accent:#ffd27a"><div class="top"><div class="icon">🧪</div><span class="pill">Test page</span></div><h3>Fake scam pressure page</h3><p>The bundle includes a local pressure-test page used to demonstrate RED hard-stop behavior.</p><div class="tags"><span class="tag">test</span><span class="tag">pressure</span></div></article> |
| </div> |
| </section> |
|
|
| <section class="wrap" id="gates"> |
| <h2>Gate model</h2> |
| <div class="split"> |
| <div class="panel"> |
| <h3>What the browser asks</h3> |
| <div class="equation">Is the page honest enough? |
| Is the request structurally bounded? |
| Is the user being pressured? |
| Is the storage or permission request auditable? |
| Is agency being preserved or captured?</div> |
| </div> |
| <div class="panel"> |
| <h3>What the prototype demonstrates</h3> |
| <div class="equation">GREEN/YELLOW/RED browser gate |
| Shield mode |
| RED hard-stop test page |
| Hash-chained audit log |
| Custom browser icon |
| Windows EXE/installer build configuration</div> |
| </div> |
| </div> |
| </section> |
|
|
| <section class="wrap" id="proof"> |
| <h2>Proof-of-wiring, not production readiness</h2> |
| <div class="warn"> |
| <p><strong>This branch shows a local prototype path:</strong> HIR/OAM gates wired into an Electron/Chromium browser shell with a RED hard-stop demonstration, audit-feed behavior, and bundled ecosystem documentation.</p> |
| <p>The point is not that the browser is finished. The point is that the agency-gate concept has a runnable prototype surface and can be reviewed as software-facing architecture.</p> |
| </div> |
| </section> |
|
|
| <section class="wrap" id="files"> |
| <h2>Packet files</h2> |
| <p class="lead">The Hugging Face Space is a public landing page. The included source ZIP is the review packet for the local Electron/Chromium prototype.</p> |
| <div class="panel"> |
| <div class="equation">Main search target: |
| Primordial_Browser_v0.1.3_Ecosystem_EXE_Builder_Source.zip |
|
|
| Support references: |
| Primordial_Browser_v0.1.3_RELEASE_README_FIRST.txt |
| README_ECOSYSTEM.md |
| RUNTIME_GATE_MODEL.md |
| HIR_OAM_BROWSER_MAP.md |
| WHAT_THIS_IS_NOT.md |
| fake_scam_pressure_page.html</div> |
| </div> |
| </section> |
|
|
| <section class="wrap" id="boundary"> |
| <h2>Boundary</h2> |
| <div class="danger"> |
| <p><strong>This is a pre-validation prototype branch.</strong></p> |
| <p>It is not a finished browser, not antivirus, not anti-malware, not a certified safety product, not clinical software, not legal software, not certified navigation software, not child-safety certification, and not a guarantee of safe browsing.</p> |
| <p>Do not treat the prototype as production security software. Use only for demonstration, review, local testing, and bounded architecture discussion. Verify source, hashes, and provenance before running any local build.</p> |
| <p><strong>Structural correspondence, not ontological equivalence.</strong></p> |
| </div> |
| </section> |
| </main> |
|
|
| <footer class="wrap"> |
| <strong>Runtime / Browser / HIR Shield Stack</strong><br/> |
| Created and developed by Collin D. Weber · Primordial Browser v0.1.3 public landing branch.<br/> |
| Source search target: <code>Primordial_Browser_v0.1.3_Ecosystem_EXE_Builder_Source.zip</code> |
| </footer> |
| </body> |
| </html> |
|
|
