该技能定义了一套工业粗野主义与战术遥测风格的网页界面设计规范，强调原始功能性、机械精度与高数据密度，刻意抛弃常规消费级UI模式。
用途与视觉范式
技能用于指导构建兼具中世纪瑞士字体设计、工业制造手册和复古未来主义航天/军事终端气质的网页界面。设计系统包含两种互斥的视觉原型，每个项目必须只选其一并贯彻到底，不得交替或混用：
- 瑞士工业印刷：源于1960年代企业识别系统与重型机械蓝图。特征包括高对比度浅色模式（新闻纸/米白基底）、厚重无衬线大字排版、由可见分隔线勾勒的严苛结构网格、以超大出血数字或字母营造的不对称留白、仅用主红色作为警示/强调色。
- 战术遥测与CRT终端：源于机密军事数据库、传统大型机和航空航天平视显示器。特征包括仅限深色模式、高密度表格化数据、等宽字体的绝对主导、技术性框线元素（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；一律大写，用于所有元数据、导航、单元ID和坐标。
- 纹理对比（艺术性破坏）：高对比度衬线体，推荐Playfair Display、EB Garamond、Times New Roman。使用极为克制，必须施加重度后处理（半调滤镜、1位抖动）以降解矢量完美感，与干净的无衬线体形成纹理并置。
色彩系统
色彩架构不妥协，严禁渐变、柔和投影和现代透明效果。颜色模拟物理介质或原始发光显示。关键要求：每个项目选择一种基底调色板并一致使用，不得在同一界面混用明暗基底。
- 若为瑞士工业印刷（浅色）：背景#F4F4F0或#EAE8E3（哑光、未漂白文档纸）；前景#050505至#111111（碳墨）；强调色#E61919或#FF2A2A（航空/警示红），这是唯一强调色，用于删除线、粗结构分隔线或关键数据高亮。
- 若为战术遥测（深色）：背景#0A0A0A或#121212（关闭的CRT，避免纯#000000）；前景#EAEAEA（白磷光），为主要文本色；强调色同样为#E61919或#FF2A2A，规则相同。终端绿#4AF626为可选，仅用于单一特定UI元素（如一个状态指示灯或一个数据读数），绝不作为通用文本色；若无明确用途则完全省略。
布局与空间工程
布局必须呈现数学工程感，拒绝常规网页内边距，改用可见的分区隔断：严格遵循CSS Grid架构，元素不浮动，精确锚定到网格轨道和交点；大量使用1px或2px实线边框划分信息区，水平线（<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模拟水平电子束扫掠，示例：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()函数，确保超大文本尺度积极扩展的同时在各视口下保持结构完整性。
适用场景与限制
技能适用于需要传达原始功能感、机械精度和高数据密度的网页界面设计，如工业主题展示、技术仪表盘、复古终端风格页面等。限制包括：必须从两种视觉原型中选定一种并贯彻，不得混用；明暗基底不得在同一界面混用；禁止渐变、柔和投影、现代透明度和圆角；终端绿仅限单一明确用途；衬线体仅作极克制的纹理对比且须重度后处理。资料未提供具体安装命令、代码包结构、收费信息或平台要求。