Add legal page (footer link) + wiki modal disclaimer link to general-orientation notice

css/styles.css

@@ -1547,6 +1547,16 @@ body[data-lang="en"] .hide-de { display: none !important; }
   background: #e4e6eb;
   color: #1c1e21;
 }
+.wiki-modal-note {
+  font-size: 12px;
+  line-height: 1.5;
+  color: #65676b;
+  margin-top: 16px;
+  padding-top: 10px;
+  border-top: 1px solid #e4e6eb;
+}
+.wiki-modal-note a { color: #1877f2; text-decoration: none; }
+.wiki-modal-note a:hover { text-decoration: underline; }
 
 TELEGRAM BANNER
    ======================================== */
@@ -1655,6 +1665,57 @@ TELEGRAM BANNER
 }
 /* Underline slide-in effect */
 .footer-bottom { padding-top: 16px; }
+
+/* ========================================
+   LEGAL PAGE (legal.html)
+   ======================================== */
+.legal-page {
+  min-height: 100vh;
+  background: #f7f8fa;
+}
+.legal-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px 24px;
+  background: #fff;
+  border-bottom: 1px solid #e4e6eb;
+}
+.legal-title {
+  font-size: 15px;
+  font-weight: 700;
+  color: #1c1e21;
+}
+.legal-container {
+  max-width: 820px;
+  margin: 32px auto;
+  padding: 32px 28px;
+  background: #fff;
+  border: 1px solid #e4e6eb;
+  border-radius: 14px;
+  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
+}
+.legal-back {
+  display: inline-block;
+  color: #1877f2;
+  font-weight: 600;
+  font-size: 14px;
+  margin-bottom: 24px;
+  text-decoration: none;
+}
+.legal-back:hover { text-decoration: underline; }
+.legal-h1 {
+  font-size: 22px;
+  font-weight: 700;
+  color: #1c1e21;
+  margin-bottom: 20px;
+}
+.legal-p {
+  font-size: 15px;
+  line-height: 1.7;
+  color: #333;
+  margin-bottom: 18px;
+}
 @media (min-width: 769px) {
   .nav-toggle { display: none; }
 }