montana/Russian/Site/montana-quest-hub/index.html

178 lines
7.6 KiB
HTML
Raw Normal View History

2026-05-18 18:05:32 +03:00
<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
<title>Монтана</title>
<meta name="theme-color" content="#0c0a08">
<meta name="apple-mobile-web-app-title" content="Монтана">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="icon" type="image/svg+xml" href="/messenger/favicon.svg">
<link rel="icon" type="image/png" sizes="32x32" href="/messenger/favicon-32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/messenger/apple-touch-icon.png">
<style>
:root {
--bg: #0c0a08;
--bg-soft: #14110d;
--bg-card: #1a1612;
--bg-hover: #221c16;
--line: #2a2520;
--ink: #e8e0d0;
--ink-mute: #8a8175;
--ink-faint: #4a443c;
--gold: #ca9335;
--gold-soft: #d9a755;
--gold-deep: #8e6824;
color-scheme: dark;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; margin: 0; padding: 0; }
html, body { background: var(--bg); color: var(--ink); min-height: 100%; }
body {
font-family: -apple-system, "SF Pro Text", Inter, system-ui, sans-serif;
line-height: 1.5; -webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility; min-height: 100dvh;
}
.wrap {
max-width: 720px; margin: 0 auto;
padding: 2.5rem 1.25rem 4rem;
display: flex; flex-direction: column; align-items: stretch;
}
header { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; }
.symbol {
font-family: ui-serif, Georgia, serif; font-size: 4.5rem; line-height: 1;
color: var(--gold); text-shadow: 0 0 60px rgba(202,147,53,0.25);
}
h1 {
font-family: ui-serif, Georgia, "Source Serif Pro", Charter, serif;
font-size: 2.25rem; font-weight: 500; color: var(--gold);
letter-spacing: 0.04em; line-height: 1;
}
.tagline {
text-align: center; color: var(--ink);
font-family: ui-serif, Georgia, serif; font-size: 1.0625rem;
margin: 0.25rem auto 0; max-width: 28rem; letter-spacing: 0.005em;
}
.tagline small { display: block; color: var(--ink-mute); font-size: 0.8125rem; margin-top: 0.5rem; letter-spacing: 0.04em; }
.grid { display: grid; grid-template-columns: 1fr; gap: 0.875rem; margin-top: 1.5rem; }
@media (min-width: 560px) { .grid { grid-template-columns: 1fr 1fr; } }
.service {
background: var(--bg-card); border: 1px solid var(--line);
border-radius: 0.875rem; padding: 1.125rem 1.25rem;
text-decoration: none; color: var(--ink);
display: flex; align-items: flex-start; gap: 0.875rem;
transition: border-color 0.15s, background 0.15s, transform 0.12s;
position: relative; overflow: hidden;
}
.service:hover { border-color: var(--gold-deep); background: var(--bg-hover); }
.service:active { transform: scale(0.99); }
.service .icon {
width: 2.75rem; height: 2.75rem; flex-shrink: 0;
border-radius: 0.625rem;
background: var(--bg-soft); border: 1px solid var(--gold-deep);
color: var(--gold);
display: flex; align-items: center; justify-content: center;
font-family: ui-serif, Georgia, serif; font-size: 1.5rem; font-weight: 600;
}
.service .body { flex: 1; min-width: 0; }
.service .name {
font-family: ui-serif, Georgia, serif; font-size: 1.125rem;
color: var(--gold); font-weight: 500; letter-spacing: 0.01em;
margin-bottom: 0.125rem;
}
.service .desc { color: var(--ink-mute); font-size: 0.8125rem; line-height: 1.45; }
.service .arrow {
align-self: center; color: var(--gold-deep); font-size: 1.25rem;
transition: transform 0.15s, color 0.15s;
}
.service:hover .arrow { transform: translateX(3px); color: var(--gold); }
footer {
margin-top: 2rem; padding-top: 1.5rem;
border-top: 1px solid var(--line);
display: flex; flex-direction: column; gap: 0.625rem;
text-align: center; color: var(--ink-mute); font-size: 0.8125rem;
}
footer a { color: var(--gold-deep); text-decoration: none; }
footer a:hover { color: var(--gold); }
footer .row { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.875rem; }
.join { margin-top: 1.5rem; padding: 1.25rem; background: var(--bg-card); border: 1px solid var(--line); border-radius: 0.875rem; display: flex; flex-direction: column; gap: 0.5rem; align-items: stretch; }
.join-title { font-family: ui-serif, Georgia, serif; font-size: 1.25rem; color: var(--gold); font-weight: 500; letter-spacing: 0.01em; }
.join-sub { color: var(--ink-mute); font-size: 0.875rem; margin: 0; }
.join-cmd { padding: 0.75rem 0.875rem; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 0.5rem; color: var(--gold-soft); font-family: ui-monospace, Menlo, monospace; font-size: 0.8125rem; word-break: break-all; user-select: all; }
.join-copy { align-self: flex-start; padding: 0.5rem 0.875rem; border: 1px solid var(--gold-deep); border-radius: 0.5rem; background: transparent; color: var(--gold); font-family: inherit; font-size: 0.8125rem; cursor: pointer; transition: background 0.15s; }
.join-copy:hover { background: var(--bg-hover); }
.join-hint { color: var(--ink-faint); font-size: 0.75rem; margin: 0; font-style: italic; }
</style>
</head>
<body>
<div class="wrap">
<header>
<div class="symbol">Ɉ</div>
<h1>Монтана</h1>
<div class="tagline">
Сеть городов, доверяющих друг другу.
<small>Сервисы протокола Montana</small>
</div>
</header>
<div class="grid">
<a class="service" href="/vpn/">
<div class="icon"></div>
<div class="body">
<div class="name">ВПН</div>
<div class="desc">Защищённый интернет через узлы Montana</div>
</div>
<div class="arrow"></div>
</a>
<a class="service" href="/messenger/">
<div class="icon"></div>
<div class="body">
<div class="name">Чаты</div>
<div class="desc">Шифрованный мессенджер с входом по 24 словам</div>
</div>
<div class="arrow"></div>
</a>
<a class="service" href="https://hub.montana.quest/">
<div class="icon"></div>
<div class="body">
<div class="name">Хаб</div>
<div class="desc">Открытый репозиторий протокола</div>
</div>
<div class="arrow"></div>
</a>
<a class="service" href="/net/">
<div class="icon"></div>
<div class="body">
<div class="name">Сеть</div>
<div class="desc">Карта узлов и состояние протокола</div>
</div>
<div class="arrow"></div>
</a>
</div>
<section class="join">
<h2 class="join-title">Свой узел</h2>
<p class="join-sub">Поднимите зеркало Montana на своём сервере одной командой.</p>
<div class="join-cmd" id="joinCmd">curl -sL https://montana.quest/install.sh | sudo bash</div>
<button class="join-copy" onclick="(async()=>{try{await navigator.clipboard.writeText(document.getElementById('joinCmd').textContent);this.textContent='Скопировано';setTimeout(()=>this.textContent='Скопировать',1800)}catch(e){}})()">Скопировать</button>
<p class="join-hint">После установки — сообщите свой IP, и узел появится в DNS round-robin.</p>
</section>
<footer>
<div class="row">
<a href="/explorer/">Эксплорер</a>
<a href="/privacy">Приватность</a>
<a href="/humans.txt">humans.txt</a>
</div>
<div>Алик Монтана · Genesis 9.01.2026</div>
</footer>
</div>
</body>
</html>