/* Preserve the wordmark's vertical anchor, while answers extend the page in flow. */
html, body { overflow-x:hidden; overflow-y:auto; }
.frame { row-gap:1rem; }
.frame > main {
  --word-block-height:calc(clamp(6rem,16svh,12rem) + clamp(3.6rem,12.96vw,12.96rem));
  align-self:start;
  min-width:0;
  grid-template-columns:minmax(0,1fr);
  padding-top:max(2rem,calc(50svh - var(--word-block-height) / 2 - clamp(1.1rem,3vw,2.5rem) - 2rem));
}
.frame > main > .secret-gate {
  position:relative; left:auto; bottom:auto;
  margin:clamp(1.5rem,4svh,3rem) 0 1rem;
  transform:translateY(1rem) scale(.96);
}
.frame > main > .secret-gate.revealed { transform:translateY(0) scale(1); }
.frame > main > .secret-gate:not(.revealed) { display:none; }
.laya-nav { width:min(34rem,calc(100vw - 3rem)); margin:1.25rem auto 0; text-align:left; cursor:auto; }
#laya-nav-form { position:relative; margin:0; }
.laya-nav textarea {
  display:block; width:100%; height:4.75rem; min-height:4.75rem; resize:none;
  border:1px solid var(--hairline); border-radius:0;
  background:rgba(244,240,230,.035); color:var(--ink);
  padding:1.05rem 4.25rem 1.05rem 1.15rem;
  font:400 1rem/1.65 "Microsoft YaHei","PingFang SC",sans-serif;
  transition:border-color .2s ease,background .2s ease;
}
.laya-nav textarea::placeholder { color:var(--muted); opacity:.9; }
.laya-nav textarea:focus { border-color:rgba(var(--accent-rgb),.65); background:rgba(var(--accent-rgb),.035); }
.laya-nav textarea:focus-visible,.laya-nav button:focus-visible,.laya-nav a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
#laya-nav-submit {
  position:absolute; right:.7rem; top:50%; transform:translateY(-50%);
  display:grid; place-items:center; width:2.75rem; height:2.75rem;
  padding:0; border:0; color:var(--accent); background:transparent;
  font:400 1.55rem/1 sans-serif; cursor:pointer; transition:background .2s ease;
}
#laya-nav-submit:hover { background:rgba(var(--accent-rgb),.09); }
#laya-nav-submit:disabled { opacity:.4; cursor:wait; }
.laya-nav__feedback { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
#laya-nav-status { margin:.65rem 0 0; color:var(--muted); font:400 .8rem/1.6 "Microsoft YaHei",sans-serif; }
#laya-nav-cancel { flex:none; margin-top:.65rem; padding:.35rem .5rem; min-height:2.75rem; border:0; color:var(--muted); background:transparent; cursor:pointer; font-size:.8rem; }
#laya-nav-results { display:grid; gap:.35rem; }
#laya-nav-results:not(:empty) { margin-top:.75rem; }
.laya-nav__answer { margin:0 0 .35rem; color:var(--ink); font:400 .95rem/1.9 "Microsoft YaHei","PingFang SC",sans-serif; white-space:pre-line; overflow-wrap:anywhere; }
.laya-nav__answer-link { display:block; min-height:2.75rem; padding:.6rem .2rem; border-bottom:1px solid var(--hairline); color:var(--accent); text-decoration:none; font:400 .88rem/1.5 "Microsoft YaHei",sans-serif; }
.laya-nav__answer-link:hover { color:var(--ink); }
.laya-nav__result {
  display:flex; align-items:center; justify-content:space-between; gap:.8rem;
  min-height:2.75rem; padding:.65rem .2rem; border-bottom:1px solid var(--hairline);
  color:var(--ink); text-decoration:none; font:400 .9rem/1.5 "Microsoft YaHei",sans-serif;
}
.laya-nav__result:hover { color:var(--accent); border-bottom-color:rgba(var(--accent-rgb),.5); }
.laya-nav__result small { color:var(--muted); font-size:.75rem; white-space:nowrap; }
.laya-nav [hidden] { display:none!important; }
@media (max-width:680px) {
  .frame > main {
    --word-block-height:calc(clamp(6rem,16svh,12rem) + clamp(3.168rem,17.28vw,5.76rem));
    padding-top:max(2rem,calc(50svh - var(--word-block-height) / 2 - 3rem));
  }
  .laya-nav { width:calc(100vw - 3rem); }
  .laya-nav textarea { padding-left:.9rem; font-size:1rem; }
}
@media (prefers-reduced-motion:reduce) { .laya-nav * { transition:none!important; scroll-behavior:auto; } }
