97a7d2bd7c
- Performance: cache the chain index (was rebuilt on every navigation) and warm it at startup — .bch pages open near-instantly after the first. - Loading indicator: indeterminate bar under the toolbar, per-tab spinner, and reload⇄stop button (driven by did-start/stop-loading + BNS resolve). - Chrome cleanup: removed the bottom status bar and the redundant search box; security padlock now always present at the front of the address bar; minimal ICANN/BCNR pill at the end; favorites bar shows only on new-tab. - Search: added Yandex; engine picker moved into Settings > General. - Settings redesigned with a left sidebar (General / Performance / Privacy / Anti-fingerprinting). Anti-fingerprinting now Show/Hide/Spoof/Manual for timezone, language, AND location (geolocation coords overridden in-page).
219 lines
11 KiB
HTML
219 lines
11 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Choose — Silent Mode</title>
|
|
<meta name="description" content="Two internets, twice over. The one you browse, and the one you build on. Every layer of the conventional web has someone who can say no. The other one has nobody.">
|
|
<link rel="stylesheet" href="/shared.css">
|
|
<style>
|
|
/* Page-specific only — tokens, body and buttons come from shared.css.
|
|
`.capsule`, not `.pill`: shared.css already uses `.pill` for status badges.
|
|
|
|
No top nav here on purpose: the page asks two questions and a nav bar offers a
|
|
third answer that undermines both. */
|
|
|
|
body{background:#05070c}
|
|
body::before{
|
|
content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
|
|
background:
|
|
radial-gradient(620px 400px at 24% 26%, rgba(75,123,236,.10), transparent 60%),
|
|
radial-gradient(620px 400px at 76% 74%, rgba(255,77,94,.10), transparent 60%),
|
|
radial-gradient(1200px 700px at 50% 118%, rgba(214,255,61,.05), transparent 70%);
|
|
animation:drift 22s ease-in-out infinite alternate;
|
|
}
|
|
@keyframes drift{from{transform:translate3d(0,0,0)} to{transform:translate3d(0,-14px,0)}}
|
|
@media (prefers-reduced-motion:reduce){body::before{animation:none} .capsule-card{transition:none}}
|
|
|
|
:root{ --red:#ff4d5e; --red-deep:#9b1725; --blue:#4b7bec; --blue-deep:#1e3a8a; }
|
|
|
|
main{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:4.4rem 1.4rem 3rem}
|
|
|
|
.eyebrow{color:var(--dim);font:600 12px/1 system-ui;letter-spacing:.28em;
|
|
text-transform:uppercase;text-align:center;margin:0 0 1.2rem}
|
|
main h1{font-size:clamp(2rem,4.6vw,2.9rem);font-weight:600;line-height:1.2;
|
|
text-align:center;margin:.4rem 0 1.1rem;letter-spacing:.2px}
|
|
.intro{color:var(--mut);font-size:1.03rem;max-width:660px;margin:0 auto 3rem;text-align:center}
|
|
|
|
/* section headers */
|
|
.act{max-width:1000px;margin:0 auto;padding:0}
|
|
.act + .act{margin-top:3.6rem;padding-top:3.2rem;border-top:1px solid rgba(255,255,255,.07)}
|
|
.act-head{text-align:center;margin:0 auto 1.8rem;max-width:600px}
|
|
.act-num{display:inline-block;font:700 11px/1 system-ui;letter-spacing:.22em;text-transform:uppercase;
|
|
color:var(--acid);background:rgba(214,255,61,.1);padding:5px 11px;border-radius:999px;margin-bottom:.9rem}
|
|
.act-head h2{font-size:1.5rem;font-weight:600;margin:0 0 .4rem;letter-spacing:.2px}
|
|
.act-head p{color:var(--mut);font-size:14.5px;margin:0}
|
|
|
|
.capsules{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
|
|
@media (max-width:800px){.capsules{grid-template-columns:1fr}}
|
|
|
|
.capsule-card{
|
|
position:relative;display:flex;flex-direction:column;
|
|
background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
|
|
border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:30px 26px 24px;
|
|
text-decoration:none;color:inherit;
|
|
transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
|
|
}
|
|
.capsule-card:hover{transform:translateY(-4px)}
|
|
.capsule-card.blue:hover{border-color:rgba(75,123,236,.5);box-shadow:0 12px 40px rgba(75,123,236,.16)}
|
|
.capsule-card.red:hover{border-color:rgba(255,77,94,.5);box-shadow:0 12px 40px rgba(255,77,94,.16)}
|
|
.capsule-card:focus-visible{outline:2px solid var(--acid);outline-offset:3px}
|
|
|
|
.capsule{
|
|
width:84px;height:38px;border-radius:999px;margin:0 auto 18px;position:relative;
|
|
box-shadow:inset 0 -3px 6px rgba(0,0,0,.35), 0 6px 18px rgba(0,0,0,.4);
|
|
}
|
|
.capsule::before{
|
|
content:"";position:absolute;top:5px;left:12px;right:12px;height:9px;border-radius:999px;
|
|
background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0));filter:blur(1px);
|
|
}
|
|
.capsule.blue{background:linear-gradient(180deg,var(--blue),var(--blue-deep))}
|
|
.capsule.red{background:linear-gradient(180deg,var(--red),var(--red-deep))}
|
|
|
|
.tag{font:600 11px/1 system-ui;letter-spacing:.24em;text-transform:uppercase;text-align:center;margin-bottom:7px}
|
|
.capsule-card.blue .tag{color:#7fa3f2}
|
|
.capsule-card.red .tag{color:#ff7885}
|
|
.capsule-card h3{font-size:1.26rem;font-weight:600;text-align:center;margin:0 0 1.1rem;letter-spacing:.2px}
|
|
|
|
ul.points{list-style:none;padding:0;margin:0 0 1.5rem;display:grid;gap:10px}
|
|
ul.points li{color:var(--mut);font-size:14px;line-height:1.62;padding-left:18px;position:relative}
|
|
ul.points li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%}
|
|
.capsule-card.blue ul.points li::before{background:#4b7bec}
|
|
.capsule-card.red ul.points li::before{background:var(--red)}
|
|
ul.points b{color:var(--ink);font-weight:600}
|
|
|
|
.spacer{flex:1}
|
|
.go{display:block;text-align:center;padding:12px 18px;border-radius:10px;
|
|
font-weight:600;font-size:14px;border:1px solid transparent}
|
|
.capsule-card.blue .go{background:rgba(75,123,236,.13);color:#93b4f5;border-color:rgba(75,123,236,.34)}
|
|
.capsule-card.red .go{background:var(--red);color:#0d0509}
|
|
|
|
.foot{color:var(--mut);font-size:12.5px;text-align:center;margin-top:3.4rem;line-height:1.8}
|
|
.foot a{color:var(--mut);text-decoration:underline;text-underline-offset:2px}
|
|
.foot a:hover{color:var(--ink)}
|
|
.foot .alt{color:var(--dim)}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<main>
|
|
|
|
<p class="eyebrow">Silent Mode</p>
|
|
<h1>Two internets. <span class="g">Twice over.</span></h1>
|
|
<p class="intro">The web you use every day is owned — companies decide which names exist,
|
|
which pages load, and whose voice carries. There is a second web running on the same
|
|
wires, with no registrar and no gatekeeper. Whether you want to <em>use</em> it or
|
|
<em>build</em> on it, it starts the same way: something you install, and a name that is
|
|
actually yours.</p>
|
|
|
|
<!-- ════ ACT I — the web you browse ════════════════════════════════ -->
|
|
<section class="act" aria-labelledby="act1">
|
|
<div class="act-head">
|
|
<span class="act-num">First choice</span>
|
|
<h2 id="act1">The web you browse</h2>
|
|
<p>Where you read, post, and are read. Pick the one you want to live in.</p>
|
|
</div>
|
|
|
|
<div class="capsules">
|
|
|
|
<a class="capsule-card blue" href="/choose/stay/">
|
|
<div class="capsule blue" aria-hidden="true"></div>
|
|
<p class="tag">The blue one</p>
|
|
<h3>Stay where it is easy.</h3>
|
|
<ul class="points">
|
|
<li><b>Your account is a permission.</b> It exists while the platform allows it,
|
|
under terms they rewrite when they like.</li>
|
|
<li><b>What you publish stays up until it does not.</b> Moderation is theirs,
|
|
appeals go to them, and the reasons need not be given.</li>
|
|
<li><b>You are the measured product.</b> Attention is the business model, so
|
|
being watched is not a bug in the system — it <em>is</em> the system.</li>
|
|
<li><b>The reach you built is not portable.</b> Leave, and the audience stays
|
|
behind.</li>
|
|
</ul>
|
|
<div class="spacer"></div>
|
|
<span class="go">It works. Mostly. →</span>
|
|
</a>
|
|
|
|
<a class="capsule-card red" href="/choose/free/">
|
|
<div class="capsule red" aria-hidden="true"></div>
|
|
<p class="tag">The red one</p>
|
|
<h3>Step outside it.</h3>
|
|
<ul class="points">
|
|
<li><b>No account, anywhere.</b> No email, no sign-up, no password to reset.
|
|
Nothing to suspend, because nothing was granted.</li>
|
|
<li><b>A name that is yours by key, not by permission.</b> Held on a public
|
|
ledger; no registrar stands between you and it.</li>
|
|
<li><b>Pages nobody can pull.</b> On your own server, spread across strangers
|
|
who are paid to keep it, or inside a transaction the whole network stores.</li>
|
|
<li><b>Nobody to petition, because nobody is in charge.</b> That cuts both ways,
|
|
and it is the honest trade.</li>
|
|
</ul>
|
|
<div class="spacer"></div>
|
|
<span class="go">Show me →</span>
|
|
</a>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ════ ACT II — the web you build on ═════════════════════════════ -->
|
|
<section class="act" aria-labelledby="act2">
|
|
<div class="act-head">
|
|
<span class="act-num">Second choice</span>
|
|
<h2 id="act2">The web you build on</h2>
|
|
<p>If you ship things, the question repeats one layer down — and this time the
|
|
gatekeepers have invoices.</p>
|
|
</div>
|
|
|
|
<div class="capsules">
|
|
|
|
<a class="capsule-card blue" href="/choose/registrars/">
|
|
<div class="capsule blue" aria-hidden="true"></div>
|
|
<p class="tag">The blue one</p>
|
|
<h3>Rent it, like everyone.</h3>
|
|
<ul class="points">
|
|
<li><b>A domain is a lease, not a title.</b> You rent it yearly at whatever the
|
|
registrar charges next time, and forgetting once can lose it.</li>
|
|
<li><b>Suspension is a supported feature.</b> Registrars act on court orders, UDRP
|
|
rulings and their own policy — by design, not by failure.</li>
|
|
<li><b>Every layer keeps a veto.</b> The host has terms of service. The CDN has an
|
|
acceptable-use policy. The certificate authority can revoke.</li>
|
|
<li><b>It is genuinely good infrastructure.</b> Fast, cheap, supported, and
|
|
someone answers the phone. That is the deal you are making.</li>
|
|
</ul>
|
|
<div class="spacer"></div>
|
|
<span class="go">The conventional stack →</span>
|
|
</a>
|
|
|
|
<a class="capsule-card red" href="/register.html">
|
|
<div class="capsule red" aria-hidden="true"></div>
|
|
<p class="tag">The red one</p>
|
|
<h3>Own the name outright.</h3>
|
|
<ul class="points">
|
|
<li><b>The name is a certificate you hold.</b> A CashToken on Bitcoin Cash — your
|
|
key controls it, and there is no company in the middle to ask.</li>
|
|
<li><b>Host it however you like.</b> Your own server, the Sia storage network, or
|
|
on-chain for something small. Repoint it whenever, for free.</li>
|
|
<li><b>No API key and no account.</b> Names are CashTokens, records are OP_RETURN,
|
|
and one beacon address enumerates the whole registry. No sidechain, no fork.</li>
|
|
<li><b>Run every part of it yourself.</b> A node plus a small BNS-only indexer
|
|
fits a one-core VPS. Any TLD works — the protocol has no allowlist.</li>
|
|
</ul>
|
|
<div class="spacer"></div>
|
|
<span class="go">Find a name →</span>
|
|
</a>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<p class="foot">
|
|
Running on Bitcoin Cash <b>chipnet</b> — an alpha on a test network, free to try, and
|
|
honest about being early.<br>
|
|
<span class="alt">You are reading this on <a href="/">silentmode.st</a>, the
|
|
ordinary-web face of the project. The same pages served the other way live at
|
|
<a href="https://navigate.st/bns/silentmode.bch">silentmode.bch</a>.</span>
|
|
</p>
|
|
|
|
</main>
|
|
|
|
</body>
|
|
</html>
|