/* ===== tyy.best 门户样式（登录 / 首页 / 管理页共用） ===== */
:root {
  --bg: #faf6ef;
  --card: #ffffff;
  --ink: #38342d;
  --muted: #92897b;
  --accent: #e2704e;
  --accent-soft: #fbe8e0;
  --green: #7ca86d;
  --green-soft: #eaf2e5;
  --line: #efe6d7;
  --shadow: 0 6px 24px rgba(140, 110, 70, 0.10);
  --radius: 18px;
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", "Noto Sans SC", "Segoe UI", sans-serif;
}

/* 文件传输工具 */
.tools-wrap { max-width: 980px; }
.capacity-strip { display:flex; justify-content:space-between; gap:20px; align-items:center; margin:18px 0; padding:16px 18px; color:#174c3d; background:#e8f6f0; border:1px solid #bee1d2; border-radius:8px; }
.capacity-strip > div:first-child { display:flex; align-items:baseline; gap:12px; }
.capacity-label,.capacity-detail { color:#527268; font-size:13px; }
.capacity-strip strong { font-size:24px; }
.tool-create-form { display:grid; gap:18px; }
.tool-mode { border:0; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.tool-mode legend { font-weight:700; margin-bottom:8px; }
.tool-mode label { display:flex; align-items:flex-start; gap:10px; padding:13px; border:1px solid var(--line); border-radius:8px; cursor:pointer; }
.tool-mode label:has(input:checked) { border-color:#2e8b70; background:#eef8f4; }
.tool-mode span { display:grid; gap:3px; }.tool-mode small { color:var(--muted); }
.tool-created { margin-top:16px; padding:14px; background:#f2f8ff; border:1px solid #c8ddf0; border-radius:8px; }
.tool-created > div { display:flex; gap:8px; align-items:center; margin-top:8px; }.tool-created code { overflow-wrap:anywhere; }
.tool-key { display:grid!important; grid-template-columns:auto auto 1fr; }.tool-key strong { font-size:24px; letter-spacing:4px; }
.tool-section-head,.tool-share-head,.tool-share-meta,.tool-share-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.tool-share h3,.tool-section-head h2 { margin:0; }.tool-share-head a { font-size:13px; overflow-wrap:anywhere; }
.tool-share-meta { justify-content:flex-start; color:var(--muted); font-size:13px; margin:12px 0; }
.tool-settings { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:10px 0; padding:10px; background:#faf8f4; border-radius:8px; }.tool-settings label { font-size:13px; }.tool-settings select,.tool-settings input { margin-left:5px; padding:5px 7px; border:1px solid var(--line); border-radius:6px; background:#fff; }.tool-settings input { width:90px; }
.tool-upload { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:12px; background:#f7f9fa; border:1px dashed var(--line); border-radius:8px; }
.tool-upload .pick-summary,.tool-upload progress { grid-column:1/-1; width:100%; }
.tool-file,.tool-request,.tool-visitor { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; min-height:44px; padding:8px 0; border-bottom:1px solid var(--line); }
.tool-file span:nth-child(2),.tool-visitor span:first-child { display:grid; }.tool-file small,.tool-visitor small { color:var(--muted); }
.tool-request code { font-size:20px; letter-spacing:2px; }.tool-share-actions { justify-content:flex-end; margin-top:16px; }
.tool-approve-form { display:flex; gap:8px; margin:8px 0; }.tool-approve-form input { width:220px; max-width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font-size:16px; letter-spacing:2px; }
.tool-receive-page { padding:20px; }.panel.tool-receive { width:min(620px,100%); max-width:620px; }.receive-files { display:grid; gap:8px; margin:18px 0; }
.receive-file { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:12px; color:inherit; text-decoration:none; border:1px solid var(--line); border-radius:8px; }
.receive-file b { overflow-wrap:anywhere; }.receive-file small { color:var(--muted); }.receive-file em { color:#287b63; font-style:normal; font-weight:700; }
.tool-request-code { display:grid; justify-items:center; gap:6px; margin-top:14px; padding:16px; background:#f2f8ff; border-radius:8px; }.tool-request-code strong { font-size:34px; letter-spacing:6px; }
@media (max-width:640px) { .capacity-strip,.tool-share-head,.tool-share-actions { align-items:stretch; flex-direction:column; }.tool-mode { grid-template-columns:1fr; }.tool-upload { grid-template-columns:1fr; }.tool-key { grid-template-columns:1fr!important; }.receive-file { grid-template-columns:auto minmax(0,1fr) auto; }.receive-file small { grid-column:2; }.capacity-strip strong { font-size:20px; } }

* { margin: 0; padding: 0; box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  font-family: var(--font);
  background:
    radial-gradient(1000px 500px at 15% -10%, #fdeee2 0%, transparent 60%),
    radial-gradient(900px 500px at 95% 0%, #eaf2e5 0%, transparent 55%),
    var(--bg);
  color: var(--ink);
  line-height: 1.75;
  min-height: 100vh;
}

a { color: var(--accent); text-decoration: none; }
a:hover { opacity: 0.85; }

.center-page { display: flex; align-items: center; justify-content: center; padding: 24px; }

.login-shell { width: min(100%, 380px); display: flex; flex-direction: column; align-items: stretch; }
.login-shell .panel { width: 100%; }
.login-footer { margin-top: 14px; text-align: center; }

.panel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 36px 32px;
  width: 100%;
  max-width: 380px;
  text-align: center;
}

.big-emoji { font-size: 46px; margin-bottom: 8px; }
.panel h1 { font-size: 22px; margin-bottom: 4px; }
.muted { color: var(--muted); font-size: 14px; }

.field { margin-top: 14px; text-align: left; }
.field label { font-size: 13px; color: var(--muted); display: block; margin-bottom: 4px; }
.field input {
  width: 100%;
  font-family: var(--font);
  font-size: 16px;   /* 不能小于 16px：iOS Safari 会在聚焦小字号输入框时自动放大页面 */
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg);
  color: var(--ink);
  outline: none;
}
.field input:focus { border-color: var(--accent); background: #fff; }

.btn {
  display: inline-block;
  font-family: var(--font);
  font-size: 15px;
  font-weight: 600;
  padding: 10px 22px;
  border: none;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  cursor: pointer;
  transition: opacity 0.15s ease;
}
.btn:hover { opacity: 0.85; color: #fff; }
.btn.small { font-size: 13px; padding: 6px 14px; }
.btn.ghost { background: transparent; color: var(--muted); border: 1px solid var(--line); }
.btn.danger { background: #c0533a; }
.btn.full { width: 100%; margin-top: 18px; }

/* 验证码 */
.captcha-row { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; }
.captcha-row input {
  flex: 1 1 120px;
  min-width: 110px;   /* 小屏上宁可换行，也别把输入框挤到看不全 */
  letter-spacing: 4px;
  text-transform: uppercase;
}
.captcha-box {
  flex: 0 0 auto;
  width: 132px;
  max-width: 100%;
  height: 46px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fdfaf5;
  cursor: pointer;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.captcha-box:hover { border-color: var(--accent); }
.captcha-box svg { display: block; }
.captcha-loading { font-size: 12px; color: var(--muted); }

.error-box {
  margin-top: 12px;
  background: var(--accent-soft);
  color: #a04a2e;
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 13px;
}
.ok-box {
  margin-top: 12px;
  background: var(--green-soft);
  color: #4f7a42;
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 13px;
}

/* ---- 门户首页 ---- */
.portal-wrap { max-width: 760px; margin: 0 auto; padding: 40px 24px; text-align: center; }
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 36px;
  flex-wrap: wrap;
}
.topbar .who { color: var(--muted); font-size: 14px; }
.identity-who { display: inline-flex; align-items: center; gap: 8px; }
.profile-avatar {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-soft), var(--green-soft));
  color: var(--ink);
  font-weight: 700;
  border: 2px solid #fff;
  box-shadow: 0 2px 10px rgba(90, 70, 45, 0.12);
}
.profile-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }
.profile-avatar.tiny { width: 30px; height: 30px; font-size: 12px; }
.profile-avatar.large { width: 92px; height: 92px; font-size: 34px; }
.hero-emoji { font-size: 52px; margin-bottom: 6px; }
.portal-wrap h1 { font-size: clamp(28px, 6vw, 40px); letter-spacing: 2px; margin-bottom: 10px; }
.tagline { color: var(--muted); font-size: clamp(14px, 2.5vw, 17px); margin-bottom: 40px; }

.entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.entry-grid.single { grid-template-columns: minmax(0, 420px); justify-content: center; }
@media (max-width: 560px) { .entry-grid { grid-template-columns: 1fr; } }

.entry-card {
  display: block;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 32px 24px 26px;
  color: var(--ink);
  text-align: center;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.entry-main { display: block; color: inherit; }
.entry-main:hover { color: inherit; opacity: 1; }
.entry-legal { display: block; margin-top: 14px; color: var(--muted); font-size: 12px; }
.entry-legal a { margin-left: 3px; text-decoration: underline; }
.legal-consent { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; text-align: left; color: var(--muted); font-size: 12px; line-height: 1.55; }
.legal-consent input { flex: none; margin-top: 3px; width: 16px; height: 16px; accent-color: var(--green); }
.legal-wrap { width: min(860px, calc(100% - 32px)); margin: 28px auto 60px; }
.legal-document { padding: 32px; }
.legal-document h1 { font-size: 28px; margin-bottom: 4px; }
.legal-content { margin-top: 24px; white-space: normal; overflow-wrap: anywhere; }
.legal-content h2 { margin: 24px 0 8px; font-size: 20px; }
.legal-content h3 { margin: 18px 0 6px; font-size: 17px; }
.legal-content p { margin: 7px 0; }
.legal-list { padding-left: 20px; position: relative; }
.legal-list::before { content: ""; position: absolute; left: 4px; top: 0.8em; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }
.field textarea, .field select { width: 100%; font: inherit; font-size: 16px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--ink); outline: none; }
.field textarea:focus, .field select:focus { border-color: var(--accent); background: #fff; }
.legal-tools { align-items: flex-end; }
.entry-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(140, 110, 70, 0.16);
  opacity: 1;
  color: var(--ink);
}
.entry-icon { font-size: 38px; margin-bottom: 8px; }
.entry-card h2 { font-size: 19px; margin-bottom: 4px; }
.entry-card p { color: var(--muted); font-size: 14px; margin-bottom: 14px; }
.entry-go { color: var(--accent); font-size: 14px; font-weight: 600; }

.portal-footer { margin-top: 48px; color: var(--muted); font-size: 13px; }

/* ---- 个人中心 ---- */
.account-page { padding: 28px 20px 60px; }
.account-wrap { width: 100%; max-width: 880px; margin: 0 auto; }
.account-nav { margin-bottom: 20px; }
.account-hero { display: flex; align-items: center; gap: 20px; margin-bottom: 8px; }
.account-hero h1 { font-size: 28px; line-height: 1.3; }
.account-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.account-card { margin-top: 12px; }
.account-card:last-child { grid-column: 1 / -1; }
.account-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.account-card input[type="file"] { padding: 8px; }
@media (max-width: 680px) {
  .account-grid { grid-template-columns: 1fr; }
  .account-card:last-child { grid-column: auto; }
  .account-hero { align-items: flex-start; }
}

/* ---- 管理页 ---- */
.admin-wrap { max-width: 1180px; margin: 0 auto; padding: 32px 20px 60px; }
.admin-wrap h1 { font-size: 24px; margin-bottom: 4px; }

.card-block {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px 26px;
  margin-top: 22px;
  text-align: left;
}
.card-block h2 { font-size: 17px; margin-bottom: 12px; }

.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
th { color: var(--muted); font-weight: 600; font-size: 13px; }
td label { margin-right: 12px; cursor: pointer; }
td input[type="checkbox"] { accent-color: var(--green); margin-right: 4px; vertical-align: -2px; }

.inline-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.inline-form .field { margin-top: 0; flex: 1 1 140px; }
.inline-form .checks { padding-bottom: 8px; font-size: 14px; white-space: nowrap; }
.inline-form .checks input { accent-color: var(--green); vertical-align: -2px; }

/* ---- 审计日志 / 安全管理 ---- */
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.section-heading h2 { margin-bottom: 2px; }
.audit-card { margin-top: 26px; }
.audit-table td { vertical-align: top; }
.audit-detail { white-space: normal; min-width: 180px; max-width: 360px; color: var(--muted); }
.status-badge { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600; }
.status-badge.success { background: var(--green-soft); color: #4f7a42; }
.status-badge.failure { background: var(--accent-soft); color: #a04a2e; }
.subheading { font-size: 14px; margin: 22px 0 8px; color: var(--muted); }
.security-table-wrap { margin-top: 18px; }
.inline-form .field.compact { flex: 0 1 110px; }
.audit-filters { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 9px; margin-bottom: 14px; }
.audit-filters input, .audit-filters select {
  min-width: 0; width: 100%; font: inherit; font-size: 14px; padding: 8px 10px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--bg); color: var(--ink);
}
.audit-admin-scroll { max-height: 620px; overflow: auto; }
.audit-admin-scroll thead { position: sticky; top: 0; background: var(--card); z-index: 1; }
code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }
@media (max-width: 760px) {
  .section-heading { align-items: center; }
  .audit-filters { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 500px) {
  .audit-filters { grid-template-columns: 1fr; }
}

.account-footer { width: 100%; text-align: center; }

.login-device-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid #e5e7df}.login-device-row>div{min-width:0}.login-device-row strong,.login-device-row small{display:block;overflow-wrap:anywhere}.login-device-row small{margin-top:5px;color:#7a8176;font-size:12px}.login-device-row button{flex-shrink:0}.qr-device-choice{border:1px solid #e6e9df;border-radius:14px;padding:12px;margin:14px 0}.qr-device-choice label{display:inline-flex;gap:5px;align-items:center;margin:8px}

/* Block browser edge refresh on the page, while allowing nested panels to pass vertical scrolling to it. */
html,body{overscroll-behavior:none!important}
*{-webkit-tap-highlight-color:transparent}:is(button,a,[role=button]):focus:not(:focus-visible){outline:none}:is(button,a,[role=button]):focus-visible{outline:2px solid #78956b;outline-offset:3px}