【用途与定位】这是面向网页界面的设计技能，旨在构建融合中世纪瑞士版式印刷、工业制造手册以及复古未来航空／军事终端风格的界面。其目标是呈现原始功能性、机械精度与高数据密度，并刻意舍弃常规消费级 UI 模式。
【两套视觉原型（每项目只能择一并贯穿始终，不得混用）】
- 瑞士工业印刷：源自 1960 年代企业识别系统与重型机械蓝图，主打高对比浅色模式（新闻纸／米白基底）、厚重无衬线排版、可见分隔线勾勒的刚性网格、以超大出血数字或字形打破的非对称留白，并以主红作为警示／强调色。
- 战术遥测与 CRT 终端：源自机密军事数据库、遗留大型机与航空平视显示器（HUD），仅用深色模式、高密度表格数据、等宽字体主导，融入技术性框线装置（ASCII 括号、十字准星），并模拟硬件限制（荧光辉光、扫描线、低位深渲染）。
【字体架构】排版是主要结构与装饰基础设施，图像次要，强调尺度、字重与间距的极端变化。宏观排版采用新怪诞／重型无衬线（如 Neue Haas Grotesk Black、Inter Extra Bold／Black、Archivo Black、Roboto Flex Heavy、Monument Extended），以流体排版部署于超大尺度（如 clamp(4rem,10vw,15rem)），字距极紧（约 -0.03em 至 -0.06em），行高高度压缩（0.85 至 0.95），仅用大写。微观排版采用等宽／技术无衬线（如 JetBrains Mono、IBM Plex Mono、Space Mono、VT323、Courier Prime），固定小尺度（10px 至 14px／0.7rem 至 0.875rem），字距宽松（0.05em 至 0.1em），行高 1.2 至 1.4，仅用大写，用于全部元数据、导航、单元编号与坐标。纹理对比采用高对比衬线（如 Playfair Display、EB Garamond、Times New Roman），使用极为克制，并须经重度后处理（半色调滤镜、1 位抖动）以打破矢量完美感。
【配色系统】禁止渐变、柔和投影与现代半透明。每项目只选一种基底配色并保持一致，不得在同一界面混用浅色与深色基底。瑞士工业印刷（浅色）：背景 #F4F4F0 或 #EAE8E3，前景 #050505 至 #111111（碳墨），强调色 #E61919 或 #FF2A2A（航空／危险红），为该模式唯一强调色，用于删除线、粗结构分隔线或关键数据高亮。战术遥测（深色）：背景 #0A0A0A 或 #121212（关闭的 CRT，避免纯黑），前景 #EAEAEA（白磷光）为主文字色，强调红同上、规则相同；终端绿 #4AF626 为可选，仅用于单个特定 UI 元素（如一个状态指示或一个数据读数），绝不作为通用文字色，若无可明确用途则完全省略。
【布局与空间工程】布局须如数学工程般精确。蓝图网格：严格遵循 CSS Grid，元素不浮动，精确锚定于网格轨道与交点。可见分区：大量使用实线边框（1px 或 2px solid）划定信息区域，<hr> 常横跨整个容器宽度以分隔操作单元。双模密度：在极端数据密度（密集等宽元数据聚集）与围绕宏观排版的大片计算留白之间摆动。几何：完全拒绝 border-radius，所有转角必须为精确 90 度。
【UI 构件与符号】以功能性工业图形元素替代常规 Web UI 惯例。语法装饰：用 ASCII 字符框定数据点，如框线 [ DELIVERY SYSTEMS ]、< RE-IND >，方向符 >>>、///、\\。工业标记：将注册 ®、版权 ©、商标 ™ 之符号作为结构性几何元素而非法律文本使用。技术资产：在网格交点集成十字准星（+）、重复竖线（条形码）、粗水平警示条纹及随机字符串数据（如 REV 2.6、UNIT / D-01）以模拟运行中的机械过程。
【纹理与后处理效果】通过 CSS 与 SVG 滤镜在前端内置模拟性模拟退化，避免设计显得纯数字化。半色调与 1 位抖动：将连续色调图像或大号衬线字转为点阵图案，可通过预处理或 CSS mix-blend-mode: multiply 叠加结合 SVG 径向点图案实现。CRT 扫描线：对终端界面在背景施加重复线性渐变以模拟水平电子束扫掠（示例：repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.1) 2px, rgba(0,0,0,0.1) 4px)）。机械噪点：对 DOM 根施加全局低透明度 SVG 静态／噪点滤镜，为深浅两种模式引入统一的物理颗粒感。
【Web 工程指令】网格确定性：使用 display: grid; gap: 1px; 配合对比的父子背景色，生成数学上完美、极细的分隔线，无需复杂边框声明。语义刚性：使用精确语义标签（<data>、<samp>、<kbd>、<output>、<dl>）构建 DOM，以准确反映遥测的技术本质。排版钳制：仅对宏观排版实现 CSS clamp() 函数，确保超大文本在各视口下激进缩放同时保持结构完整。
【适用场景与限制】适用于追求工业、军事、终端的版面与数据密度风格的网页界面设计项目。限制方面：两套原型不得在同一界面混用；不得混用浅色与深色基底；禁用渐变、柔和投影、半透明与圆角；终端绿仅限单一用途。资料未提供该技能的价格、收费、平台兼容性与具体使用步骤等信息。