/*
 * 08-first-open-layer — 第一次打开 app 的那一层（#em-first-open）自己的样式（FIRST-OPEN-UI-001，C-320／C-321／C-322／C-324 ②）。
 * 原在 08-elyrem-additions.css「5b」那一节，一字不改搬来（WEB-GATE-001 ②）：主包（其余样式、脚本与 app 的 DOM）登录之后才下发，
 * 首开三屏要在那之前就画出来，所以这几条跟着公开的那一小包走；那一节里管 app 本身的两条（这一层盖着时 app 不露、评估时藏顶栏底栏）
 * 留在原处。选择器全是 #em-first-open 起头、与 08 其余的规则不相交，挪到 08 后面级联不变（config/entry.json 的 styles 记着先后）。
 */
/* 没有账号会话时 first-open-runner 把这一层盖在 app 上面。它是 #elyrem-maison 的**兄弟**、不在它里面：模板给 #elyrem-maison button
   定了 font: inherit／color: inherit（id 选择器），放在里面会盖掉 GPT .efg-*／.efa-* 那些按类写的字号与颜色。
   **首开这一层统一深色**（创始人 2026-09-21：「这里不要浅色的，就统一拿我包里给的那个」，C-322）：color-scheme 钉 dark，
   GPT 的 light-dark() 全走深的那一边，不随系统、不随 app 的主题三档；底色 --em-bg 由 runner 从 #elyrem-maison 身上抄
   （钉了 dark 之后它也落深色端）。GPT 的卡片（.efg-screen：390 宽、圆角 30、最矮 760）居中，卡片本身一条规则不改。 */
#em-first-open {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
  color-scheme: dark;
  background: var(--em-bg, light-dark(#f4f3ef, #171819));
}
#em-first-open[hidden] {
  display: none;
}
#em-first-open #elyrem-first-open-experience {
  width: 100%;
}
/* 铺满手机屏（创始人 2026-09-22「没铺满 iPhone 屏幕吗」，C-324 ②）：GPT 的卡片（.efg-screen，欢迎段那一屏也带这个类）是给独立
   预览用的手机框——390 宽、圆角 30、最矮 760，在 iPhone 上上下各露一条底色。在我们壳里高度跟视口走；手机宽度上去掉最大宽与圆角；
   宽屏仍居中保持手机比例（GPT：不是新增桌面布局）。GPT 的 CSS 一字不改，只在这里盖。 */
#em-first-open .efg-screen {
  min-height: 100dvh;
}
@media (max-width: 480px) {
  #em-first-open #elyrem-first-open-experience,
  #em-first-open .efg-screen {
    max-width: none;
    border-radius: 0;
  }
}
/* 返回登录的口子（模板没有、我们有，C-321 ②）：GPT 自己的文字键样式（.efa-text-button），放在表单下面、错误信息（绝对定位在
   表单正下方）再往下一截。 */
#em-first-open .efo-switch {
  display: block;
  width: 100%;
  /* 错误信息最长两行（12px × 1.6 × 2 ＋ 12px 顶距 ≈ 50px），口子要落在它下面。 */
  margin-top: 58px;
  text-align: center;
  cursor: pointer;
}

/* FO-3／R2（我们的层，UI-FIX-002；C-636 ④）：GPT 首开那几份的字体栈是 -apple-system 打头，在 iPhone 上中文落到苹方，进了 app 却是
   Noto Sans SC——孩子看到的前十几屏与后面不是一个字（C-314 ① 定了苹方不进栈）。这里只换字体家族、不动字号字重（GPT 的 10–16 css
   按哈希钉着，一字不改）：界面拉丁用 Manrope、中文用 Noto Sans SC，两家公开包的 00-fonts.css 都带着。字标（Bodoni）不在此列。
   GPT 那几条写的是 font 简写，子元素各自带家族，一条一条盖。 */
#em-first-open :is(
    .efg-screen,
    .efg-form__enter,
    .efa-code__input,
    .efa-code__cells span,
    .efa-text-button,
    .efw-question,
    .efw-mood__options button,
    .efw-purpose__option,
    .efw-start__choice
  ) {
  font-family: Manrope, "Noto Sans SC", sans-serif;
}

/* 首开三屏与欢迎段顶上那一格（BRAND-001 BR-4，C-633 ②⑤）：GPT 模板那两行放确认字标的内联 SVG（build.mjs 按 <!-- @wordmark --> 填），
   颜色是 currentColor、跟原稿那一格的字色走（.efg-brand 深色房间里的浅墨、.efw-brand 那一格原稿还压了 .64 的透明度），入场动效也照原稿那一格。
   大小：三屏那一格宽 110 px（docs/80 草图 brand-placements.svg 的 4）；欢迎段原稿字号是三屏的 26／35，照这个比例缩到 82 px。 */
.efg-brand-mark,
.efw-brand-mark {
  display: block;
  height: auto;
  margin: 0 auto;
}
.efg-brand-mark {
  width: 110px;
}
.efw-brand-mark {
  width: 82px;
}

/* 首开整屏房间（IPAD-001 ④，docs/80 W-4、C-640；草图 review-ui/ipad-proposal.svg 第三行）：iPad 横屏与电脑上原稿是屏中间一张
   手机卡（390 宽、圆角 30），两边一大片底色。宽屏上房间铺满整屏——建筑、斜光、暮色照原稿，只是不再裁成一张卡；密钥、邮箱、验证码的
   表单与欢迎段的字收在中间一栏（最宽 440），字号照原稿。这一层在登录之前就要画，主包里判宽的 data-wide 那时还没有，这里按屏宽判：
   不窄于 1000（手机竖着、横着都到不了；iPad 竖屏盖着「转过来」），与宽屏那一层同一个门槛。 */
@media (min-width: 1000px) {
  #em-first-open #elyrem-first-open-experience,
  #em-first-open .efg-screen {
    max-width: none;
    border-radius: 0;
  }
  #em-first-open .efg-screen {
    box-shadow: none;
  }
  #em-first-open :is(.efg-content, .efw-content) {
    width: 100%;
    max-width: 440px;
    margin-inline: auto;
  }
}