/* 留言板样式（与「应用中心」同一套视觉） */
:root{
  --bg:#070b16;
  --card:rgba(18,26,50,.72);
  --line:rgba(126,166,255,.14);
  --line-strong:rgba(126,166,255,.3);
  --text:#eaf0ff;
  --muted:#8da0cc;
  --acc:#2ee88b;
  --warn:#ff6b81;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{height:100%}
body{
  margin:0;min-height:100%;color:var(--text);
  background:
    radial-gradient(1100px 700px at 50% -18%, #182552 0%, rgba(24,37,82,0) 60%),
    radial-gradient(900px 600px at 104% 110%, #0d3350 0%, rgba(13,51,80,0) 58%),
    var(--bg);
  background-attachment:fixed;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  padding:calc(16px + env(safe-area-inset-top)) calc(14px + env(safe-area-inset-right)) calc(22px + env(safe-area-inset-bottom)) calc(14px + env(safe-area-inset-left));
  -webkit-user-select:none;user-select:none;
  overscroll-behavior-y:contain;
}
.shell{max-width:680px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
a{color:inherit}

/* ---------- 头部 ---------- */
.top{padding:2px 4px 0}
.back{
  display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--muted);
  font-size:13px;border:1px solid var(--line);border-radius:999px;padding:6px 13px;background:rgba(18,26,50,.6);
  transition:.16s
}
.back:hover{color:var(--text);border-color:var(--line-strong)}
h1{margin:14px 2px 6px;font-size:clamp(22px,4.6vmin,30px);font-weight:800;letter-spacing:.5px}
h1 em{font-style:normal;background:linear-gradient(180deg,#fff,#8bffc4);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{margin:0 2px;color:var(--muted);font-size:clamp(12px,2.1vmin,13.5px);line-height:1.7}
.sub b{color:var(--acc)}

/* ---------- 卡片 ---------- */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:18px;
  padding:clamp(14px,2.6vmin,20px);backdrop-filter:blur(10px);
  box-shadow:0 16px 40px rgba(0,0,0,.32)
}

/* ---------- 表单 ---------- */
.field{margin-bottom:14px}
.label{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:#c8d6f5;margin-bottom:7px}
.label i{font-style:normal;color:var(--muted);font-size:11.5px;font-variant-numeric:tabular-nums}
.label i.over{color:var(--warn)}
input[type=text],textarea{
  width:100%;background:rgba(9,14,28,.72);color:var(--text);font-family:inherit;font-size:14.5px;
  border:1px solid var(--line);border-radius:12px;padding:11px 13px;outline:none;transition:.16s;resize:vertical
}
input[type=text]:focus,textarea:focus{border-color:var(--line-strong);box-shadow:0 0 0 3px rgba(46,232,139,.12)}
textarea{min-height:96px;line-height:1.7}
::placeholder{color:#5f6f96}

/* 蜜罐：藏起来但不用 display:none（部分脚本会跳过不可见元素） */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
button{
  font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;border:0;border-radius:12px;
  padding:12px 26px;color:#06220f;background:linear-gradient(180deg,#5cf0a0,#2fbf6c);
  box-shadow:0 10px 24px rgba(46,232,139,.26);transition:transform .1s,opacity .2s
}
button:active{transform:scale(.97)}
button[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none}
button.ghost{
  background:rgba(255,255,255,.07);color:#dbe6ff;box-shadow:none;border:1px solid var(--line);
  padding:8px 16px;font-size:13px;font-weight:600
}
.hint{font-size:12.5px;color:var(--muted);min-height:16px}
.hint.bad{color:var(--warn)}
.hint.good{color:var(--acc)}

/* ---------- 列表 ---------- */
.list-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
h2{margin:0;font-size:15.5px;font-weight:700;display:flex;align-items:center;gap:8px}
.pill{
  font-size:11.5px;font-weight:600;color:var(--muted);border:1px solid var(--line);
  border-radius:999px;padding:3px 10px;background:rgba(9,14,28,.5)
}
.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.msg{display:flex;gap:11px;padding:12px;border-radius:14px;background:rgba(9,14,28,.5);border:1px solid var(--line)}
.msg.fresh{border-color:var(--line-strong);box-shadow:0 0 0 3px rgba(46,232,139,.12)}
.av{
  flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:16px;color:#06220f;background:linear-gradient(160deg,#8bffc4,#2fbf6c);
  -webkit-user-select:none;user-select:none
}
.main{min-width:0;flex:1 1 auto}
.head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.who{font-size:13.5px;font-weight:700;color:#eaf0ff;word-break:break-word}
.when{font-size:11.5px;color:var(--muted);margin-left:auto;white-space:nowrap}
.body{
  margin:6px 0 0;font-size:14.5px;line-height:1.75;color:#dbe6ff;
  white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere
}
.empty,.error{margin:6px 0 0;font-size:13.5px;color:var(--muted);text-align:center;padding:16px 6px}
.error{color:var(--warn)}

/* ---------- 页脚 ---------- */
.foot{margin-top:4px;color:var(--muted);font-size:11.5px;line-height:1.8;text-align:center}
.foot p{margin:0}
.foot a{color:#b9c7e8}
.foot .muted{margin-top:4px;opacity:.8}
.foot b{color:#b9c7e8}

/* ---------- 提示条 ---------- */
.toast{
  position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%);
  background:rgba(9,14,28,.94);border:1px solid var(--line-strong);color:var(--text);
  border-radius:12px;padding:11px 18px;font-size:13.5px;box-shadow:0 14px 34px rgba(0,0,0,.5);
  z-index:20;max-width:min(90vw,420px);text-align:center
}
.toast.err{border-color:rgba(255,107,129,.5)}
