@anglefeint/astro-theme 0.1.0-alpha.0 → 0.1.0-alpha.2

package/public/styles/about-page.css

@@ -1,4 +1,4 @@
-			body.term-page {
+			body.hacker-page {
 				background: #000 !important;
 				background-image: none !important;
 				color: rgba(255, 255, 255, 0.88);
@@ -13,14 +13,14 @@
 				--chrome-active: rgba(255, 255, 255, 0.5);
 				--chrome-text-muted: rgba(255, 255, 255, 0.5);
 			}
-			body.term-page::-webkit-scrollbar { width: 6px; }
-			body.term-page::-webkit-scrollbar-track { background: transparent; }
-			body.term-page::-webkit-scrollbar-thumb {
+			body.hacker-page::-webkit-scrollbar { width: 6px; }
+			body.hacker-page::-webkit-scrollbar-track { background: transparent; }
+			body.hacker-page::-webkit-scrollbar-thumb {
 				background: rgba(255, 255, 255, 0.22);
 				border-radius: 3px;
 			}
-			/* fixed header + content offset (mirrors mesh-page in global.css) */
-			body.term-page header {
+			/* fixed header + content offset (mirrors ai-page in global.css) */
+			body.hacker-page header {
 				position: fixed;
 				top: 0;
 				left: 0;
@@ -29,47 +29,47 @@
 				backdrop-filter: blur(3px);
 				-webkit-backdrop-filter: blur(3px);
 			}
-			body.term-page .term-content {
+			body.hacker-page .hacker-content {
 				padding-top: calc(3em + 56px);
 			}
-			body.term-page .term-content,
-			body.term-page footer {
+			body.hacker-page .hacker-content,
+			body.hacker-page footer {
 				position: relative;
 				z-index: 10;
 			}
 			/* footer: Anonymous 灰白 */
-			body.term-page footer {
+			body.hacker-page footer {
 				--chrome-bg: rgba(0, 0, 0, 0.85);
 				--chrome-border: rgba(255, 255, 255, 0.15);
 				border-top-color: rgba(255, 255, 255, 0.15) !important;
 				color: rgba(255, 255, 255, 0.55);
 			}
-			body.term-page footer a {
+			body.hacker-page footer a {
 				color: rgba(255, 255, 255, 0.7) !important;
 			}
-			body.term-page footer a:hover {
+			body.hacker-page footer a:hover {
 				color: rgba(0, 255, 100, 0.9) !important;
 			}
 			@media (max-width: 720px) {
-				body.term-page .term-content {
+				body.hacker-page .hacker-content {
 					padding-top: calc(1em + 56px);
 				}
 			}
 			/* ── terminal background ── */
-			.term-bg {
+			.hacker-bg {
 				position: fixed;
 				inset: 0;
 				z-index: 0;
 				overflow: hidden;
 				pointer-events: none;
 			}
-			.term-bg-canvas {
+			.hacker-bg-canvas {
 				position: absolute;
 				inset: 0;
 				width: 100%;
 				height: 100%;
 			}
-			.term-scanlines {
+			.hacker-scanlines {
 				position: absolute;
 				inset: 0;
 				/* 浅色扫描线：在深色背景上可见，全屏 CRT 感 */
@@ -82,7 +82,7 @@
 				);
 				pointer-events: none;
 			}
-			.term-vignette {
+			.hacker-vignette {
 				position: absolute;
 				inset: 0;
 				background: radial-gradient(
@@ -93,30 +93,30 @@
 				);
 				pointer-events: none;
 			}
-			.term-flicker {
+			.hacker-flicker {
 				position: absolute;
 				inset: 0;
 				background: transparent;
-				animation: term-flicker-anim 0.08s infinite;
+				animation: hacker-flicker-anim 0.08s infinite;
 				pointer-events: none;
 			}
-			@keyframes term-flicker-anim {
+			@keyframes hacker-flicker-anim {
 				0% { background: rgba(255, 255, 255, 0.012); }
 				50% { background: transparent; }
 				100% { background: rgba(255, 255, 255, 0.005); }
 			}
-			.term-glow {
+			.hacker-glow {
 				position: absolute;
 				inset: 0;
 				box-shadow: inset 0 0 120px rgba(255, 255, 255, 0.03);
 				pointer-events: none;
 			}
 			/* ── content ── */
-			.term-content {
+			.hacker-content {
 				position: relative;
 				z-index: 10;
 			}
-			.term-content .prose {
+			.hacker-content .prose {
 				position: relative;
 				background:
 					linear-gradient(180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.92)),
@@ -133,7 +133,7 @@
 				margin: 0 auto 2rem;
 			}
 			/* ── toast ── */
-			.term-toast {
+			.hacker-toast {
 				position: fixed;
 				right: 1rem;
 				bottom: 1rem;
@@ -155,12 +155,12 @@
 				pointer-events: none;
 				transition: opacity 0.18s ease, transform 0.18s ease;
 			}
-			.term-toast.visible {
+			.hacker-toast.visible {
 				opacity: 1;
 				transform: translateY(0);
 			}
 			/* ── progress bar ── */
-			.term-progress {
+			.hacker-progress {
 				position: fixed;
 				top: 0;
 				left: 0;
@@ -172,7 +172,7 @@
 				pointer-events: none;
 			}
 			/* ── back to top ── */
-			.term-back-to-top {
+			.hacker-back-to-top {
 				position: fixed;
 				right: 1.5rem;
 				bottom: 3.5rem;
@@ -192,12 +192,12 @@
 				pointer-events: none;
 				box-shadow: 0 0 14px rgba(255, 255, 255, 0.08);
 			}
-			.term-back-to-top.visible {
+			.hacker-back-to-top.visible {
 				opacity: 1;
 				transform: translateY(0);
 				pointer-events: auto;
 			}
-			.term-back-to-top:hover {
+			.hacker-back-to-top:hover {
 				box-shadow: 0 0 20px rgba(0, 255, 100, 0.25);
 				border-color: rgba(0, 255, 100, 0.5);
 				color: rgba(0, 255, 100, 0.95);
@@ -206,14 +206,14 @@
 			.about-title {
 				margin-bottom: 1.4rem;
 			}
-			.term-meta {
+			.hacker-meta {
 				font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
 				font-size: 0.78em;
 				color: rgba(255, 255, 255, 0.55);
 				margin-bottom: 0.62em;
 				letter-spacing: 0.04em;
 			}
-			.term-title-bar {
+			.hacker-title-bar {
 				position: relative;
 				height: 3px;
 				margin: 0.75rem 0 0.1rem;
@@ -227,7 +227,7 @@
 				);
 				box-shadow: 0 0 14px rgba(255, 255, 255, 0.1);
 			}
-			.term-title-bar::after {
+			.hacker-title-bar::after {
 				content: "";
 				position: absolute;
 				top: 0;
@@ -241,13 +241,13 @@
 					rgba(156, 163, 175, 0.6),
 					rgba(11, 15, 20, 0.4)
 				);
-				animation: term-bar-sweep 3.8s linear infinite;
+				animation: hacker-bar-sweep 3.8s linear infinite;
 			}
-			@keyframes term-bar-sweep {
+			@keyframes hacker-bar-sweep {
 				to { left: 100%; }
 			}
 			/* ── response panel: Anonymous 窗口风格 (白标题栏 + 黑内容区) ── */
-			.term-response {
+			.hacker-response {
 				border: 1px solid rgba(255, 255, 255, 0.25);
 				background: #000;
 				border-radius: 0;
@@ -257,7 +257,7 @@
 					0 0 0 1px rgba(255, 255, 255, 0.1),
 					0 8px 32px rgba(0, 0, 0, 0.6);
 			}
-			.term-response-header {
+			.hacker-response-header {
 				display: flex;
 				align-items: center;
 				gap: 0.5em;
@@ -265,21 +265,21 @@
 				background: #fff;
 				border-bottom: 1px solid rgba(0, 0, 0, 0.15);
 			}
-			.term-window-dots {
+			.hacker-window-dots {
 				display: flex;
 				gap: 6px;
 				align-items: center;
 			}
-			.term-window-dots span {
+			.hacker-window-dots span {
 				width: 10px;
 				height: 10px;
 				border-radius: 50%;
 				flex-shrink: 0;
 			}
-			.term-window-dots span:nth-child(1) { background: #ff5f57; }
-			.term-window-dots span:nth-child(2) { background: #febc2e; }
-			.term-window-dots span:nth-child(3) { background: #28c840; }
-			.term-response-label {
+			.hacker-window-dots span:nth-child(1) { background: #ff5f57; }
+			.hacker-window-dots span:nth-child(2) { background: #febc2e; }
+			.hacker-window-dots span:nth-child(3) { background: #28c840; }
+			.hacker-response-label {
 				font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
 				font-size: 0.75em;
 				color: #000;
@@ -287,42 +287,42 @@
 				letter-spacing: 0.1em;
 				text-transform: uppercase;
 			}
-			.term-body {
+			.hacker-body {
 				padding: 1rem 0.9rem 1.2rem;
 				background: #000;
 			}
 			/* ── prose body ── */
-			.term-body p,
-			.term-body h2,
-			.term-body blockquote,
-			.term-body .about-manifest {
+			.hacker-body p,
+			.hacker-body h2,
+			.hacker-body blockquote,
+			.hacker-body .about-manifest {
 				opacity: 0;
 				transform: translateY(12px);
 				transition: opacity 0.5s ease, transform 0.5s ease;
 			}
-			.term-body .term-visible {
+			.hacker-body .hacker-visible {
 				opacity: 1;
 				transform: translateY(0);
 			}
-			.term-body a {
+			.hacker-body a {
 				color: rgba(255, 255, 255, 0.9);
 				text-decoration-color: rgba(255, 255, 255, 0.35);
 			}
-			.term-body a:hover {
+			.hacker-body a:hover {
 				color: rgba(0, 255, 100, 0.95);
 				text-decoration-color: rgba(0, 255, 100, 0.6);
 			}
 			/* ── cursor ── */
-			.term-cursor {
+			.hacker-cursor {
 				display: inline-block;
 				width: 0.6em;
 				height: 1.1em;
 				background: rgba(0, 255, 100, 0.9);
 				margin-left: 2px;
 				vertical-align: text-bottom;
-				animation: term-cursor-blink 1s step-end infinite;
+				animation: hacker-cursor-blink 1s step-end infinite;
 			}
-			@keyframes term-cursor-blink {
+			@keyframes hacker-cursor-blink {
 				0%, 50% { opacity: 1; }
 				51%, 100% { opacity: 0; }
 			}
@@ -361,7 +361,7 @@
 				color: rgba(255, 255, 255, 0.6);
 			}
 			/* ── regenerate ── */
-			.term-regenerate {
+			.hacker-regenerate {
 				display: block;
 				margin: 2em auto 0;
 				padding: 0.5em 1.2em;
@@ -376,7 +376,7 @@
 				text-transform: uppercase;
 				transition: all 0.2s ease;
 			}
-			.term-regenerate:hover:not(:disabled) {
+			.hacker-regenerate:hover:not(:disabled) {
 				color: rgba(0, 255, 100, 0.95);
 				border-color: rgba(0, 255, 100, 0.4);
 				background: rgba(0, 255, 100, 0.06);
@@ -412,7 +412,7 @@
 				letter-spacing: 0.04em;
 			}
 			/* ── mouse glow (green) ── */
-			.term-mouse-glow {
+			.hacker-mouse-glow {
 				position: fixed;
 				width: 300px;
 				height: 300px;
@@ -424,31 +424,31 @@
 				border-radius: 50%;
 			}
 			/* ── load scan ── */
-			.term-load-scan {
+			.hacker-load-scan {
 				position: fixed;
 				left: 0;
 				right: 0;
 				height: 2px;
 				background: linear-gradient(90deg, rgba(11, 15, 20, 0.3), rgba(255, 0, 51, 0.7), rgba(156, 163, 175, 0.6), rgba(11, 15, 20, 0.3));
 				box-shadow: 0 0 12px rgba(255, 0, 51, 0.4);
-				animation: term-scan 0.8s ease-out forwards;
+				animation: hacker-scan 0.8s ease-out forwards;
 				pointer-events: none;
 				z-index: 20;
 			}
-			@keyframes term-scan {
+			@keyframes hacker-scan {
 				0% { top: 0; opacity: 1; }
 				100% { top: 100vh; opacity: 0.2; }
 			}
 			/* ── flash on regenerate ── */
-			.term-flash {
-				animation: term-flash-anim 0.3s ease-out;
+			.hacker-flash {
+				animation: hacker-flash-anim 0.3s ease-out;
 			}
-			@keyframes term-flash-anim {
+			@keyframes hacker-flash-anim {
 				0% { filter: brightness(2) saturate(0.5); }
 				100% { filter: none; }
 			}
 			/* ── 右侧文件夹 (Anonymous) ── */
-			.term-sidebar {
+			.hacker-sidebar {
 				position: fixed;
 				top: 20%;
 				right: 1rem;
@@ -457,7 +457,7 @@
 				flex-direction: column;
 				gap: 0.6rem;
 			}
-			.term-folder {
+			.hacker-folder {
 				display: flex;
 				align-items: center;
 				gap: 0.5rem;
@@ -473,20 +473,20 @@
 				font-size: 0.72rem;
 				letter-spacing: 0.06em;
 			}
-			.term-folder:hover {
+			.hacker-folder:hover {
 				background: rgba(0, 0, 0, 0.85);
 				border-color: rgba(0, 255, 100, 0.5);
 				color: rgba(0, 255, 100, 0.95);
 				box-shadow: 0 0 12px rgba(0, 255, 100, 0.15);
 			}
-			.term-folder-icon {
+			.hacker-folder-icon {
 				width: 24px;
 				height: 20px;
 				flex-shrink: 0;
 				opacity: 0.9;
 			}
 			/* ── 弹窗 (Anonymous 窗口) ── */
-			.term-modal-overlay {
+			.hacker-modal-overlay {
 				position: fixed;
 				inset: 0;
 				z-index: 200;
@@ -497,18 +497,18 @@
 				justify-content: center;
 				padding: 2rem;
 			}
-			.term-modal-overlay.open {
+			.hacker-modal-overlay.open {
 				display: flex;
 			}
-			.term-modal {
+			.hacker-modal {
 				width: min(420px, 100%);
 				max-height: 80vh;
 			}
-			.term-modal.term-modal-wide {
+			.hacker-modal.hacker-modal-wide {
 				width: min(900px, calc(100vw - 2rem));
 				overflow: visible;
 			}
-			.term-modal-header {
+			.hacker-modal-header {
 				display: flex;
 				align-items: center;
 				gap: 0.5rem;
@@ -516,19 +516,19 @@
 				background: #fff;
 				border-bottom: 1px solid rgba(0, 0, 0, 0.15);
 			}
-			.term-modal-dots {
+			.hacker-modal-dots {
 				display: flex;
 				gap: 6px;
 			}
-			.term-modal-dots span {
+			.hacker-modal-dots span {
 				width: 10px;
 				height: 10px;
 				border-radius: 50%;
 			}
-			.term-modal-dots span:nth-child(1) { background: #ff5f57; }
-			.term-modal-dots span:nth-child(2) { background: #febc2e; }
-			.term-modal-dots span:nth-child(3) { background: #28c840; }
-			.term-modal-title {
+			.hacker-modal-dots span:nth-child(1) { background: #ff5f57; }
+			.hacker-modal-dots span:nth-child(2) { background: #febc2e; }
+			.hacker-modal-dots span:nth-child(3) { background: #28c840; }
+			.hacker-modal-title {
 				font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
 				font-size: 0.75em;
 				color: #000;
@@ -536,7 +536,7 @@
 				letter-spacing: 0.1em;
 				text-transform: uppercase;
 			}
-			.term-modal-close {
+			.hacker-modal-close {
 				margin-left: auto;
 				width: 66px;
 				height: 66px;
@@ -550,14 +550,14 @@
 				opacity: 0.9;
 				border-radius: 10px;
 			}
-			.term-modal-close .term-modal-close-icon {
+			.hacker-modal-close .hacker-modal-close-icon {
 				flex-shrink: 0;
 			}
-			.term-modal-close:hover {
+			.hacker-modal-close:hover {
 				opacity: 1;
 				background: rgba(0, 0, 0, 0.14);
 			}
-			.term-modal-body {
+			.hacker-modal-body {
 				padding: 1rem 0.9rem 1.2rem;
 				color: rgba(255, 255, 255, 0.88);
 				font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
@@ -566,37 +566,37 @@
 				max-height: 60vh;
 				overflow-y: auto;
 			}
-			.term-modal-body pre {
+			.hacker-modal-body pre {
 				margin: 0;
 				white-space: pre-wrap;
 				word-break: break-word;
 			}
 			/* DL Data: Downloading 进度条 (Anonymous 风格) */
-			.term-modal-body.term-modal-download .modal-subtitle {
+			.hacker-modal-body.hacker-modal-download .modal-subtitle {
 				font-size: 0.9em;
 				color: rgba(255, 255, 255, 0.7);
 				margin-bottom: 1rem;
 			}
-			.term-modal-progress {
+			.hacker-modal-progress {
 				display: flex;
 				gap: 2px;
 				flex-wrap: wrap;
 				margin-top: 0.5rem;
 			}
-			.term-modal-progress span {
+			.hacker-modal-progress span {
 				width: 10px;
 				height: 12px;
 				background: rgba(255, 255, 255, 0.2);
 				transition: background 0.12s ease;
 			}
-			.term-modal-progress span.filled {
+			.hacker-modal-progress span.filled {
 				background: rgba(255, 255, 255, 0.6);
 			}
 			/* All Scripts: 文件夹网格 */
-			.term-modal-scripts {
+			.hacker-modal-scripts {
 				padding: 0.5rem 0;
 			}
-			.term-modal-scripts-path {
+			.hacker-modal-scripts-path {
 				font-size: 0.9em;
 				color: rgba(255, 255, 255, 0.9);
 				letter-spacing: 0.05em;
@@ -604,12 +604,12 @@
 				border-bottom: 1px solid rgba(255, 255, 255, 0.15);
 				padding-bottom: 0.5rem;
 			}
-			.term-modal-scripts-grid {
+			.hacker-modal-scripts-grid {
 				display: grid;
 				grid-template-columns: repeat(5, 1fr);
 				gap: 1rem;
 			}
-			.term-script-folder {
+			.hacker-script-folder {
 				display: flex;
 				flex-direction: column;
 				align-items: center;
@@ -622,40 +622,40 @@
 				text-decoration: none;
 				transition: all 0.15s ease;
 			}
-			.term-script-folder:hover {
+			.hacker-script-folder:hover {
 				background: rgba(255, 255, 255, 0.12);
 				border-color: rgba(0, 255, 100, 0.4);
 				box-shadow: 0 0 12px rgba(0, 255, 100, 0.15);
 			}
-			.term-script-folder-icon {
+			.hacker-script-folder-icon {
 				width: 32px;
 				height: 28px;
 				color: rgba(255, 255, 255, 0.7);
 			}
-			.term-script-folder-label {
+			.hacker-script-folder-label {
 				font-size: 0.72rem;
 				text-align: center;
 				word-break: break-word;
 				line-height: 1.3;
 			}
 			@media (max-width: 600px) {
-				.term-modal-scripts-grid {
+				.hacker-modal-scripts-grid {
 					grid-template-columns: repeat(3, 1fr);
 				}
 			}
 			/* Help: 虚拟键盘 */
-			.term-vkeyboard {
+			.hacker-vkeyboard {
 				display: flex;
 				flex-direction: column;
 				gap: 4px;
 				font-size: 0.7rem;
 			}
-			.term-vkeyboard-row {
+			.hacker-vkeyboard-row {
 				display: flex;
 				justify-content: center;
 				gap: 3px;
 			}
-			.term-vkey {
+			.hacker-vkey {
 				min-width: 24px;
 				height: 28px;
 				padding: 0 6px;
@@ -671,86 +671,86 @@
 				transition: all 0.1s ease;
 				user-select: none;
 			}
-			.term-vkey:hover {
+			.hacker-vkey:hover {
 				background: rgba(255, 255, 255, 0.15);
 				border-color: rgba(255, 255, 255, 0.35);
 			}
-			.term-vkey.highlight {
+			.hacker-vkey.highlight {
 				background: rgba(0, 255, 100, 0.35);
 				border-color: rgba(0, 255, 100, 0.7);
 				box-shadow: 0 0 12px rgba(0, 255, 100, 0.3);
 			}
-			.term-vkey.wide { min-width: 36px; }
-			.term-vkey.backspace { min-width: 72px; }
-			.term-vkey.space { min-width: 120px; }
-			.term-vkey.acc { background: rgba(255, 140, 0, 0.25); border-color: rgba(255, 140, 0, 0.5); }
-			.term-vkey.acc:hover { background: rgba(255, 140, 0, 0.35); }
-			.term-vkeyboard-wrap {
+			.hacker-vkey.wide { min-width: 36px; }
+			.hacker-vkey.backspace { min-width: 72px; }
+			.hacker-vkey.space { min-width: 120px; }
+			.hacker-vkey.acc { background: rgba(255, 140, 0, 0.25); border-color: rgba(255, 140, 0, 0.5); }
+			.hacker-vkey.acc:hover { background: rgba(255, 140, 0, 0.35); }
+			.hacker-vkeyboard-wrap {
 				display: flex;
 				flex-wrap: wrap;
 				gap: 2rem;
 				align-items: stretch;
 			}
-			.term-vkeyboard-main {
+			.hacker-vkeyboard-main {
 				flex: 1;
 				min-width: 0;
 			}
-			.term-vkeyboard-side {
+			.hacker-vkeyboard-side {
 				display: flex;
 				flex-direction: column;
 				gap: 6px;
 				flex-shrink: 0;
 				min-width: 140px;
 			}
-			.term-vkeyboard-side-block {
+			.hacker-vkeyboard-side-block {
 				display: flex;
 				flex-direction: column;
 				gap: 4px;
 				margin-bottom: 4px;
 			}
-			.term-vkeyboard-side-row {
+			.hacker-vkeyboard-side-row {
 				display: flex;
 				gap: 3px;
 			}
-			.term-vkeyboard-side-block .term-vkey {
+			.hacker-vkeyboard-side-block .hacker-vkey {
 				flex: 1;
 				min-width: 0;
 			}
-			.term-vkey.nav-home { background: rgba(66, 133, 244, 0.3); border-color: rgba(66, 133, 244, 0.5); }
-			.term-vkey.nav-home:hover { background: rgba(66, 133, 244, 0.4); }
-			.term-vkey.nav-end { background: rgba(234, 67, 53, 0.25); border-color: rgba(234, 67, 53, 0.5); }
-			.term-vkey.nav-end:hover { background: rgba(234, 67, 53, 0.35); }
-			.term-vkeyboard-arrows-wrap {
+			.hacker-vkey.nav-home { background: rgba(66, 133, 244, 0.3); border-color: rgba(66, 133, 244, 0.5); }
+			.hacker-vkey.nav-home:hover { background: rgba(66, 133, 244, 0.4); }
+			.hacker-vkey.nav-end { background: rgba(234, 67, 53, 0.25); border-color: rgba(234, 67, 53, 0.5); }
+			.hacker-vkey.nav-end:hover { background: rgba(234, 67, 53, 0.35); }
+			.hacker-vkeyboard-arrows-wrap {
 				display: flex;
 				flex-direction: column;
 				align-items: center;
 				margin-top: 6px;
 			}
-			.term-vkeyboard-arrows {
+			.hacker-vkeyboard-arrows {
 				display: grid;
 				grid-template: ". u ." 1fr "l d r" 1fr / 1fr 1fr 1fr;
 				gap: 2px;
 				height: 56px;
 			}
-			.term-vkeyboard-arrows .arr-u { grid-area: u; }
-			.term-vkeyboard-arrows .arr-l { grid-area: l; }
-			.term-vkeyboard-arrows .arr-r { grid-area: r; }
-			.term-vkeyboard-arrows .arr-d { grid-area: d; }
-			.term-vkeyboard-arrows .term-vkey { width: 50px; height: 22px; font-size: 0.65rem; padding: 0; }
-			.term-vkeyboard-stats {
+			.hacker-vkeyboard-arrows .arr-u { grid-area: u; }
+			.hacker-vkeyboard-arrows .arr-l { grid-area: l; }
+			.hacker-vkeyboard-arrows .arr-r { grid-area: r; }
+			.hacker-vkeyboard-arrows .arr-d { grid-area: d; }
+			.hacker-vkeyboard-arrows .hacker-vkey { width: 50px; height: 22px; font-size: 0.65rem; padding: 0; }
+			.hacker-vkeyboard-stats {
 				width: 100%;
 				margin-top: 0.2rem;
 				font-size: 0.75em;
 				color: rgba(255, 255, 255, 0.6);
 			}
-			.term-vkeyboard-stats-label {
+			.hacker-vkeyboard-stats-label {
 				font-size: 0.65rem;
 				color: rgba(255, 255, 255, 0.5);
 				letter-spacing: 0.1em;
 			}
-			.term-modal-body.term-modal-keyboard {
+			.hacker-modal-body.hacker-modal-keyboard {
 				overflow: visible;
 			}
 			@media (max-width: 900px) {
-				.term-sidebar { display: none; }
+				.hacker-sidebar { display: none; }
 			}