/* ═══════════════════════════════════════════════════════════════
   申請下架 /takedown/ 專屬樣式（pages/takedown.py、static/js/takedown.js）
   只用 site.css 的代幣；共用元件（.sec / .card / .btn / .lede / .deco）沿用。
   排版與 find.css 同一套語言，手機優先。橘色只給「送出申請」按鈕。
   ═══════════════════════════════════════════════════════════════ */
.page-takedown .sec{ scroll-margin-top:calc(var(--topbar-h) + 12px); }

/* ── 開場 + 表單 ── */
.td-hero{ overflow:hidden; padding-top:clamp(28px,4.5vw,52px); padding-bottom:clamp(24px,3vw,40px); }
.td-hero .wrap{ position:relative; }
.td-head{ position:relative; z-index:1; max-width:60ch; }
.td-title{ font-size:var(--fs-h1); font-weight:900; letter-spacing:-.02em; line-height:1.2; margin-top:4px; }
.td-title b{ color:var(--blue); font-weight:900; }
.td-lede{ margin-top:14px; color:var(--ink-dim); }

.td-form{ position:relative; z-index:1; margin-top:22px; padding:18px; max-width:640px; }
.td-fields{ display:grid; gap:16px; margin:0; padding:0; border:0; min-width:0; }
.td-fields:disabled{ opacity:.55; }
.td-field{ display:grid; gap:6px; min-width:0; }
.td-field label{ font-size:var(--fs-small); font-weight:700; color:var(--blue); }
.td-field input,
.td-field textarea{
  width:100%; min-height:48px; margin:0; padding:10px 14px;
  font:inherit; font-size:16px; line-height:1.4;                 /* 16px：iOS 對焦時不會放大頁面 */
  color:var(--ink); background:var(--card);
  border:1.5px solid var(--line); border-radius:var(--r-sm);
  transition:border-color .15s;
}
.td-field textarea{ resize:vertical; min-height:88px; }
.td-field input:focus,
.td-field textarea:focus{ border-color:var(--blue); }
.td-hint{ margin:0; font-size:var(--fs-xs); color:var(--ink-dim); line-height:1.6; }
.td-hp{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }   /* honeypot：視覺與焦點都拿掉 */
.td-submit{ width:100%; }
.td-form.is-busy .td-submit{ opacity:.7; pointer-events:none; }
.td-consent{ margin:0; font-size:var(--fs-xs); color:var(--ink-dim); line-height:1.6; }
@media (min-width:640px){
  .td-form{ padding:22px 24px; }
  .td-submit{ width:auto; min-width:160px; justify-self:start; }
}

/* ── 狀態列 ── */
.td-status{ display:flex; align-items:center; gap:10px; margin:14px 0 0; min-height:28px; font-size:var(--fs-small); font-weight:700; color:var(--ink-dim); }
.td-status::before{ content:""; flex:0 0 auto; width:10px; height:10px; border-radius:50%; background:var(--sky); }
.td-status[data-state="ok"]{ color:var(--blue); }
.td-status[data-state="ok"]::before{ background:var(--blue); }
.td-status[data-state="error"]{ color:var(--ink); }
.td-status[data-state="error"]::before{ background:var(--orange); }
.td-status[data-state="loading"]::before{
  width:16px; height:16px; background:none;
  border:2.5px solid var(--blue-tint); border-top-color:var(--blue);
  animation:td-spin .8s linear infinite;
}
@keyframes td-spin{ to{ transform:rotate(360deg); } }
.td-noscript{ margin-top:12px; font-size:var(--fs-small); color:var(--ink-dim); }

/* ── 處理方式說明 ── */
.td-notice-sec{ padding-top:clamp(22px,3vw,36px); }
.td-notice{ max-width:66ch; }
.td-notice-title{ font-size:var(--fs-h3); font-weight:900; color:var(--blue-ink); }
.td-notice-list{ margin:12px 0 0; padding-left:1.2em; color:var(--ink-dim); line-height:1.75; }
.td-notice-list li + li{ margin-top:6px; }
.td-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; margin-top:20px; }
.td-link{ font-weight:700; color:var(--blue); }
@media (prefers-reduced-motion:reduce){ .td-status[data-state="loading"]::before{ animation:none; } }
