/* 2G-06U — 联系页信笺风表单。暖纸质感,与评论区区分。本地。 */
.ww-contact-form { --cf-accent: #c9743e; max-width: 680px; margin: 6px auto 40px; padding: 26px 28px 30px;
    position: relative; border-radius: 14px; color: #4a4137;
    background:
      repeating-linear-gradient(180deg, transparent, transparent 37px, rgba(201,116,62,.10) 37px, rgba(201,116,62,.10) 38px),
      linear-gradient(180deg, #fdfaf4, #faf4ea);
    box-shadow: 0 14px 40px -18px rgba(120,80,40,.45); border: 1px solid rgba(201,116,62,.18); }
.ww-contact-form::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px;
    background: repeating-linear-gradient(45deg, var(--cf-accent) 0 10px, #f2c9a8 10px 20px); border-radius: 14px 14px 0 0; opacity: .85; }
body.dark .ww-contact-form { color: #d8cfc2; background: linear-gradient(180deg, rgba(54,48,42,.92), rgba(48,42,37,.92)); border-color: rgba(255,255,255,.08); }

/* Mio酱 说话区 */
.ww-cf-mio { display: flex; align-items: center; gap: 12px; margin: 6px 2px 20px; padding: 12px 16px;
    background: rgba(255,255,255,.6); border: 1px dashed rgba(201,116,62,.4); border-radius: 14px; }
body.dark .ww-cf-mio { background: rgba(255,255,255,.06); }
.ww-cf-mio-avatar { flex: 0 0 auto; width: 40px; height: 40px; display: inline-flex; }
.ww-cf-mio-say { font-size: 14px; line-height: 1.55; color: #7a5a3c; }
body.dark .ww-cf-mio-say { color: #e5c9ad; }

.ww-cf-grid { display: flex; gap: 16px; }
.ww-cf-grid .ww-cf-row { flex: 1 1 0; min-width: 0; }
.ww-cf-row { margin: 0 0 16px; }
.ww-cf-row label { display: block; font-size: 13px; font-weight: 600; margin: 0 0 6px 2px; color: #6b5a45; letter-spacing: .3px; }
body.dark .ww-cf-row label { color: #c9b7a3; }
.ww-cf-row label em { color: var(--cf-accent); font-style: normal; }
.ww-contact-form input[type=text], .ww-contact-form input[type=email], .ww-contact-form textarea {
    width: 100%; box-sizing: border-box; padding: 11px 13px; font-size: 14.5px; color: #4a4137;
    background: rgba(255,255,255,.75); border: 1px solid rgba(201,116,62,.28); border-radius: 10px;
    transition: border-color .15s, box-shadow .15s, background .15s; -webkit-appearance: none; }
body.dark .ww-contact-form input, body.dark .ww-contact-form textarea { color: #eee; background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
.ww-contact-form input:focus, .ww-contact-form textarea:focus { outline: none; border-color: var(--cf-accent);
    box-shadow: 0 0 0 3px rgba(201,116,62,.14); background: #fff; }
body.dark .ww-contact-form input:focus, body.dark .ww-contact-form textarea:focus { background: rgba(255,255,255,.1); }
.ww-contact-form textarea { resize: vertical; min-height: 118px; line-height: 1.6; }

/* 验证码 */
.ww-cf-captcha { display: flex; align-items: center; gap: 12px; }
.ww-cf-captcha input { flex: 0 0 150px; text-align: center; letter-spacing: 2px; }
.ww-cf-captcha-img { height: 46px; width: 158px; object-fit: cover; border-radius: 8px; cursor: pointer;
    border: 1px solid rgba(201,116,62,.3); background: #fff; box-shadow: 0 2px 8px -3px rgba(120,80,40,.4); }
.ww-cf-captcha-img.error { outline: 2px solid #e07a7a; }

/* 蜜罐:视觉隐藏但不 display:none */
.ww-cf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* 发送 */
.ww-cf-send { margin-top: 6px; padding: 12px 30px; font-size: 15px; font-weight: 700; color: #fff; cursor: pointer;
    border: none; border-radius: 999px; background: linear-gradient(135deg, var(--cf-accent), #e0894f);
    box-shadow: 0 8px 22px -8px rgba(201,116,62,.7); transition: transform .12s, box-shadow .15s, opacity .15s; }
.ww-cf-send:hover { transform: translateY(-1px); box-shadow: 0 12px 26px -8px rgba(201,116,62,.8); }
.ww-cf-send:active { transform: translateY(0); }
.ww-cf-send:disabled { opacity: .6; cursor: default; transform: none; }

/* 状态 */
.ww-cf-status { display: none; margin-top: 14px; padding: 10px 14px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; }
.ww-cf-status.show { display: block; }
.ww-cf-status.ok  { background: rgba(94,175,110,.14); color: #3f8a54; }
.ww-cf-status.err { background: rgba(224,110,110,.14); color: #c0504e; }
.ww-cf-status.info{ background: rgba(201,116,62,.12); color: #a5673a; }

@media (max-width: 560px) {
  .ww-contact-form { padding: 20px 16px 24px; }
  .ww-cf-grid { flex-direction: column; gap: 0; }
  .ww-cf-captcha { flex-wrap: wrap; }
  .ww-cf-captcha input { flex: 1 1 100%; }
}

/* --- 2G-06U 交互验证:点击展开 --- */
.ww-cf-verify-trigger { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; cursor: pointer;
    font-size: 14px; font-weight: 600; color: #7a5a3c; border: 1.5px dashed var(--cf-accent); border-radius: 999px;
    background: rgba(255,255,255,.7); transition: background .15s, transform .12s, box-shadow .15s; }
.ww-cf-verify-trigger:hover { background: rgba(201,116,62,.12); transform: translateY(-1px); box-shadow: 0 6px 16px -8px rgba(201,116,62,.6); }
.ww-cf-verify-trigger:active { transform: translateY(0); }
.ww-cf-verify-trigger .ww-cf-vt-ico { font-size: 17px; }
.ww-cf-verify-trigger.done { display: none; }
body.dark .ww-cf-verify-trigger { color: #e5c9ad; background: rgba(255,255,255,.06); }
.ww-cf-captcha[hidden] { display: none; }
.ww-cf-captcha:not([hidden]) { animation: ww-cf-reveal .28s ease; }
@keyframes ww-cf-reveal { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }

/* --- 状态横幅:独立、醒目(即使 Mio 说话区被忽略也看得到结果) --- */
.ww-cf-status { display: none; margin-top: 16px; padding: 13px 16px; border-radius: 12px; font-size: 14px; font-weight: 600;
    line-height: 1.5; border: 1px solid transparent; }
.ww-cf-status.show { display: block; animation: ww-cf-reveal .25s ease; }
.ww-cf-status.ok  { background: rgba(94,175,110,.16); color: #2f7a44; border-color: rgba(94,175,110,.4); }
.ww-cf-status.err { background: rgba(224,110,110,.16); color: #b83f3d; border-color: rgba(224,110,110,.4); }
.ww-cf-status.info{ background: rgba(201,116,62,.14); color: #9a5f34; border-color: rgba(201,116,62,.35); }

/* --- 2G-06U 双语:中英各一行,弹性列 + min-width:0 防窄屏重叠/溢出 --- */
.ww-cf-mio { align-items: flex-start; }
.ww-cf-mio-avatar { margin-top: 2px; }
.ww-cf-mio-avatar svg { display: block; width: 100%; height: 100%; }
.ww-cf-mio-say { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.ww-cf-say-zh { font-size: 14px; line-height: 1.55; color: #7a5a3c; overflow-wrap: anywhere; word-break: break-word; }
.ww-cf-say-en { font-size: 12px; line-height: 1.5; color: #a98a68; overflow-wrap: anywhere; word-break: break-word; }
body.dark .ww-cf-say-zh { color: #e5c9ad; }
body.dark .ww-cf-say-en { color: #c6a585; }
/* 状态横幅也中英各一行 */
.ww-cf-status .ww-cf-st-zh { display: block; overflow-wrap: anywhere; }
.ww-cf-status .ww-cf-st-en { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; opacity: .82; overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .ww-cf-mio { gap: 9px; padding: 11px 12px; }
  .ww-cf-mio-avatar { width: 32px; height: 32px; }
  .ww-cf-say-zh { font-size: 13.5px; }
  .ww-cf-say-en { font-size: 11.5px; }
}

/* 2G-06U: 发送按钮居中 */
.ww-cf-send { display: block; margin: 10px auto 0; }