/*
 * ROMO 视觉配置编写总则
 *
 * 1. 编辑内容必须保持为唯一一个 :root { ... } 视觉接口。建议保留完整变量表；
 *    未提交的变量沿用平台默认值。
 * 2. 只能使用接口中已有的 --room-* 名称。未知变量、重复变量、空值和语法错误
 *    均不能应用。
 * 3. 支持标准块注释。应用配置时，注释会被解析层忽略，不参与预览、保存或发布。
 *    请把注释放在变量组或变量上方，不要插入变量名和值的中间。
 * 4. 禁止外部资源和可执行或逃逸写法，包括 url()、image-set()、http:、https:、
 *    data:、!important，以及用分号、花括号、尖括号或反斜杠注入额外声明。
 * 5. 背景通过固定参数生成渐变、几何图案及细颗粒质感；不接受图片地址或外部字体。
 * 6. 字体变量必须逐字使用“字体”分组列出的许可字体栈之一，不能填写任意字体名，
 *    不能使用 local() 或上传字体。
 *
 * 注释中的“仅允许／禁止”表示解析器或服务端的强制限制；“建议／通常使用”
 * 是编写指引，并不代表服务端实施了额外的 CSS 类型或数值范围校验。
 */
:root {
  /*
   * 1. 页面背景与装饰
   * page-background 是页面底色。background-mode 为 none、linear、radial、grid、stripes、dots。
   * stops 为 2–8 个十六进制颜色与 0–100% 位置；angle 为 0–360 度，x/y 为 0–100%。
   * 图案 spacing 为 4–512px、weight 为 1–64px；pattern-color 支持六位或八位十六进制。
   * grain 为 0–100 的细颗粒强度，0 关闭。背景无图片入口。
   */
  --room-page-background: #e7e3d8;
  --room-background-mode: none;
  --room-background-stops: #e7e3d8 0%, #9c5a4a 100%;
  --room-background-angle: 90;
  --room-background-x: 50;
  --room-background-y: 50;
  --room-background-spacing: 72;
  --room-background-weight: 1;
  --room-background-pattern-color: #8a8578;
  --room-background-grain: 0;

  /*
   * 2. 基础表面、文字与语义色
   * surface、frame、control-hover、field-background、subtle-surface、preview-surface
   * 依次用于基础表面、窗口框架、可交互控件悬停、输入框、次级区域和预览区域。
   * ink、muted、disabled、text-on-primary 分别用于正文、次要、禁用和主色表面文字；
   * disabled-surface 是禁用控件背景。line、line-dark 是通用线条与单色边框。
   * primary、link、focus、highlight 用于品牌与交互；
   * danger、success、warning、warning-ink、warning-surface 用于状态反馈。
   * 建议使用明确的 CSS 颜色值；带 -ink 的变量表示对应表面上的文字颜色。
   * 颜色不限于十六进制，现有 rgba(...) 和变量引用也可以使用。
   */
  --room-surface: #f1ede3;
  --room-frame: #c8c2b4;
  --room-control-hover: #e3ddcf;
  --room-field-background: #f7f4ec;
  --room-ink: #2e2b26;
  --room-muted: #6f6a5f;
  --room-disabled: #a49e92;
  --room-disabled-surface: #ded8ca;
  --room-line: #b0a99a;
  --room-line-dark: #4a463f;
  --room-primary: #4a5a52;
  --room-primary-dark: #333f39;
  --room-link: #6b5a4a;
  --room-focus: #b08a6a;
  --room-highlight: #d9cfb8;
  --room-danger: #9c5a4a;
  --room-success: #5e6f5a;
  --room-warning: #a8814e;
  --room-text-on-primary: #f1ede3;
  --room-warning-ink: #4a3a22;
  --room-warning-surface: #e6d8bc;

  /*
   * 3. 边框与圆角
   * border-style 是通用边框线型，建议使用 solid、dashed、dotted 或 none。
   * radius-window、panel、control、field 分别控制窗口、面板、按钮控件和输入框圆角；
   * 0 表示直角，非零值需要合法 CSS 长度单位。
   * radius-panel 同时控制内容区域、次级区域和预览区域的圆角。
   */
  --room-border-style: solid;
  --room-radius-window: 2px;
  --room-radius-panel: 2px;
  --room-radius-control: 2px;
  --room-radius-field: 2px;

  /*
   * 4. 按钮、输入框与链接
   * button-background / button-ink 控制按钮。field-ink 与 field-border 控制输入框文字和边框。
   * link-decoration-style 只决定链接下划线线型，不决定是否显示。
   * nav-decoration-mode 是强制三值枚举：always 始终显示导航下划线，
   * interactive 仅交互时显示，none 始终隐藏。不要直接填写内部 --theroom-* 变量。
   * focus-outline-style 控制键盘焦点框线型，不建议使用 none 破坏可访问性。
   */
  --room-button-background: #e3ddcf;
  --room-button-ink: #2e2b26;
  --room-button-primary-background: #4a5a52;
  --room-button-primary-ink: #f1ede3;
  --room-button-danger-background: #e0cfc7;
  --room-button-danger-ink: #7a4238;
  --room-field-ink: #2e2b26;
  --room-field-border: #b0a99a;
  --room-link-decoration-style: dotted;
  --room-nav-decoration-mode: interactive;
  --room-focus-outline-style: dotted;

  /*
   * 5. 光标与滚动条
   * cursor-link、cursor-button、cursor-canvas-component 分别控制链接、按钮和画布组件光标；
   * 建议使用标准 CSS cursor 关键字，不支持自定义光标地址。
   * scrollbar-track / thumb 控制滚动条轨道和滑块。
   */
  --room-cursor-link: pointer;
  --room-cursor-button: pointer;
  --room-cursor-canvas-component: grab;
  --room-scrollbar-track: #e0dacd;
  --room-scrollbar-thumb: #8a8578;
  --room-selected-background: #cfc6b0;
  --room-selected-ink: #33302a;
  --room-overlay-background: rgba(46, 43, 38, .52);
  --room-subtle-surface: #e9e4d8;
  --room-preview-surface: #f1ede3;

  /*
   * 6. 代码编辑器
   * code-background、gutter、gutter-ink、gutter-line、active-line、selection
   * 控制编辑区、行号区、分隔线、活动行与选区。
   * code-tag、bracket、attribute、string、number、comment 控制对应语法颜色。
   * 这些变量只改变代码编辑器外观，不改变解析能力或最终房间内容。
   */
  --room-code-background: #efebe1;
  --room-code-gutter: #e3ddcf;
  --room-code-gutter-ink: #8a8578;
  --room-code-gutter-line: #c8c2b4;
  --room-code-active-line: #e6e0d3;
  --room-code-selection: #d4cab4;
  --room-code-tag: #4a5a52;
  --room-code-bracket: #4a463f;
  --room-code-attribute: #6f6a5f;
  --room-code-string: #5e6f5a;
  --room-code-number: #9c5a4a;
  --room-code-comment: #9a9488;

  /*
   * 7. 字体
   * font-ui 用于平台导航、按钮和表单；font-content 用于普通页面正文；
   * font-mono 用于代码编辑器和等宽信息；font-display 用于 Logo 邻近标题和强调展示。
   * 四项均只能完整选择以下 8 组之一，大小写、引号、逗号和回退顺序必须一致：
   *   Arial, "Microsoft YaHei", sans-serif
   *   Georgia, "SimSun", serif
   *   Consolas, "Courier New", monospace
   *   Impact, "Arial Black", "Microsoft YaHei", sans-serif
   *   system-ui, sans-serif
   *   sans-serif
   *   serif
   *   monospace
   * RoomML 文本组件固定使用平台托管的 Noto Sans CJK SC，不受这四项控制。
   */
  --room-font-ui: Arial, "Microsoft YaHei", sans-serif;
  --room-font-content: Georgia, "SimSun", serif;
  --room-font-mono: Consolas, "Courier New", monospace;
  --room-font-display: Georgia, "SimSun", serif;

  /*
   * 8. 画布整体
   * canvas-background 是实际房间画布背景；canvas-opacity 建议使用 0 至 1。
   * canvas-opacity 控制画布表面与外框；canvas-visibility 为 hidden 时隐藏这层表面与外框。组件内容不受两者影响，仍显示在网站主题背景上。
   * canvas-border 控制画布边界颜色。上述范围是使用指引，不是额外服务端范围校验。
   */
  --room-canvas-background: #f5f1e8;
  --room-canvas-opacity: 1;
  --room-canvas-visibility: visible;
  --room-canvas-border: #a49e92;

  /*
   * 9. 组件选择
   * canvas-component-selection 只影响编辑器中的组件选框，不写入组件内容。
   */
  --room-canvas-container-background: rgba(74, 90, 82, .06);
  --room-canvas-container-border: #b0a99a;
  --room-canvas-selection: #6b5a4a;
  --room-canvas-component-selection: #8a8578;
  --room-canvas-anchor-background: #f1ede3;
  --room-canvas-anchor-color: #4a5a52;
  --room-canvas-anchor-border: #a49e92;
  --room-canvas-anchor-active-background: #4a5a52;
  --room-canvas-anchor-focus: #9c5a4a;
}