:root {
    --文字颜色: #fff;
    --窗口颜色: #007acc;
    --工具背景: #0062a3;
}
网页主体 {
    外边距: 0;
    高度: 100vh;
    背景: #eee;
}
#窗口 {
    宽度: 100%;
    高度: 100%;
    边框: 可变值(--窗口颜色) 1px 实线;
    边框-顶部: 0;
    盒子模型: 边界框;
    定位: 相对定位;
    盒子-阴影: 0px 0px 10px 颜色通道(0, 0, 0, 0.5);
}
#窗口 .窗口标题 {
    背景: 可变值(--窗口颜色);
    颜色: 可变值(--文字颜色);
    文本-对齐: 居中;
    高度: 30px;
    行高: 30px;
    显示模式: 弹性布局;
}
#窗口 .窗口标题 .标题 {
    宽度: 计算(100% - 120px);
}
#窗口 .窗口标题 标题1 {
    外边距: 0;
    字体-大小: 14px;
    字体-粗细: 正常;
    定位: 绝对定位;
    左侧: 50%;
    转换: 平移x轴(-50%);
    最大-宽度: 计算(100% - 120px);
    空格: 不换行;
    文本-溢出: 省略号;
    溢出: 隐藏;
}
#窗口 .窗口标题 .工具 {
    显示模式: 弹性布局;
}
#窗口 .窗口标题 .工具 区块 {
    宽度: 40px;
    高度: 30px;
    定位: 相对定位;
    光标: 指针箭头;
}
#窗口 .窗口标题 .工具 区块:鼠标移入 {
    背景: 可变值(--工具背景);
}
#窗口 .窗口标题 .工具 .关闭:鼠标移入 {
    背景: 颜色值-红色;
}
#窗口 .窗口标题 .工具 区块:元素后 {
    内容: "";
    定位: 绝对定位;
    顶部: 50%;
    左侧: 50%;
}
#窗口 .窗口标题 .工具 .最小化:元素后 {
    宽度: 12px;
    高度: 1px;
    背景: 可变值(--文字颜色);
    左边距: -6px;
}
#窗口 .窗口标题 .工具 .最大化:元素后 {
    宽度: 11px;
    高度: 11px;
    边框: 1px 实线 可变值(--文字颜色);
    盒子模型: 边界框;
    上边距: -5.5px;
    左边距: -5.5px;
}
#窗口 .窗口标题 .工具 .关闭:元素后 {
    内容: "✖";
    顶部: 0;
    左侧: 0;
    文本-对齐: 居中;
    宽度: 100%;
}
#窗口 .窗口标题 .工具 .关闭:鼠标移入:元素后 {
    颜色: #fff;
}
#窗口.窗口内容 {
    自动换行: 字内换行;
    换行规则: 断行;
    最大-高度: 计算(100vh - 30px);
    溢出-y轴: 自动;
}