/* =====================================================================
   support.css — ОКНО ПОДДЕРЖКИ (js/support.ui.js)
   ---------------------------------------------------------------------
   Каркас — из css/auth.css (.au-backdrop, .au-card, .au-field, .au-input,
   .au-submit). Здесь только своё: выпадающий список темы, многострочное
   поле и список обращений с ответами. После auth.css.
   ===================================================================== */
.sp-card{max-width:540px}
.sp-body{display:flex;flex-direction:column}
.sp-form{display:flex;flex-direction:column;gap:14px;margin-top:4px}
.sp-select{
  appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,#BBD6F5 50%),linear-gradient(135deg,#BBD6F5 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;
  padding-right:40px;
}
.sp-select option{color:#0B0C16;background:#fff}
.sp-textarea{
  min-height:120px;resize:vertical;line-height:1.45;font-family:"Manrope",system-ui,sans-serif;
  font-size:16px;   /* 16 — чтобы iOS не увеличивал страницу при фокусе */
}
.sp-count{text-align:right}
.sp-h{
  margin:22px 0 10px;font-family:"MegaBoxFont","Arial Black",system-ui,sans-serif;font-weight:900;
  font-size:1rem;letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:var(--so),var(--extrude);
}
.sp-empty{margin:0;color:var(--cx-dim,#8E93B5);font-size:.9rem;text-align:center}
.sp-list{display:flex;flex-direction:column;gap:10px;max-height:min(46vh,420px);overflow:auto;padding-right:2px}
.sp-ticket{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.04)}
.sp-ticket.is-answered{border-color:rgba(99,224,110,.35)}
.sp-meta{display:flex;justify-content:space-between;gap:10px;font-size:.76rem;color:var(--cx-dim,#8E93B5);margin-bottom:6px}
.sp-status{font-weight:800;color:#FFE45C}
.sp-ticket.is-answered .sp-status{color:#63E06E}
.sp-q{font-size:.92rem;line-height:1.45;white-space:pre-wrap;word-break:break-word;color:#EDEBFF}
.sp-a{margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(99,224,110,.12);border-left:3px solid #63E06E}
.sp-a b{font-size:.8rem;color:#63E06E}
.sp-a i{font-size:.76rem;color:var(--cx-dim,#8E93B5);font-style:normal}
.sp-a p{margin:6px 0 0;font-size:.92rem;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.sp-links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:18px;font-size:.86rem}
.sp-links a{color:#FFE45C;font-weight:700;text-decoration:none}
.sp-links a:hover{text-decoration:underline}
