.reply-slip {
  position: absolute; z-index: 3; left: calc(50% + 110px); top: 70px;
  width: 360px; max-height: calc(100% - 100px); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; scrollbar-color: rgba(58,40,24,.28) transparent;
  padding: 20px 22px 18px;
  background: var(--bg, #f6eedd); color: #2b2118;
  border-top: 2px dashed rgba(43,33,24,.45);
  box-shadow: 0 2px 3px rgba(0,0,0,.2), 0 30px 44px -14px rgba(20,10,2,.7);
  display: flex; flex-direction: column; gap: 12px;
  animation: slip-in .28s cubic-bezier(.2,.8,.25,1) both;
  user-select: text; -webkit-user-select: text;
}
@keyframes slip-in { from { opacity: 0; transform: translate(-40px, 30px) rotate(-4deg); } to { opacity: 1; transform: rotate(1.2deg); } }
.overlay .bigcard { transition: margin-left .25s ease; }
.overlay.replying .bigcard { margin-left: -470px; }
.rp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.rp-title { margin: 0; font-family: var(--font-hand); font-size: 26px; font-weight: 700; line-height: 1.05; }
.rp-sub { font-size: 12.5px; color: #5a4636; overflow-wrap: anywhere; }
.rp-x { flex-shrink: 0; width: 36px; height: 36px; border: 0; border-radius: 18px; background: rgba(255,255,255,.4); color: var(--ink); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.rp-field { display: flex; flex-direction: column; gap: 4px; }
.rp-label { font-size: 13px; font-weight: 800; padding: 0; }
.rp-opt { font-weight: 600; color: #6b5a4a; }
.rp-input {
  width: 100%; height: 42px; padding: 0 11px;
  border: 1.5px solid rgba(58,40,24,.35); border-radius: 6px; background: #fffdf6; color: var(--ink);
  font-family: var(--font-ui); font-size: 16px;
}
.rp-input:focus { outline: none; border-color: #2b1a0c; box-shadow: 0 0 0 3px rgba(253,224,106,.6); }
.rp-textarea { height: 104px; padding: 9px 11px; resize: vertical; line-height: 1.4; }
.rp-field.invalid .rp-input, .rp-contact.invalid [data-field="phone"] .rp-input, .rp-contact.invalid [data-field="email"] .rp-input { border-color: #b3261e; }
.rp-msg { font-size: 12px; color: #b3261e; font-weight: 700; }
.rp-msg:empty { display: none; }
.rp-count { align-self: flex-end; margin-top: -8px; font-size: 12px; color: #6b5a4a; }
.rp-count:empty { display: none; }
.rp-contact { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.rp-hint { margin: 0; font-size: 12.5px; color: #5a4636; line-height: 1.35; }
.rp-contact.invalid .rp-hint { color: #b3261e; }
.rp-err { margin: 0; font-size: 12.5px; color: #b3261e; font-weight: 800; }
.rp-banner { margin: 0; padding: 10px 12px; background: #fbe2df; border-left: 4px solid #b3261e; color: #7a1a14; font-weight: 800; font-size: 13.5px; }
.rp-actions { display: flex; align-items: center; gap: 14px; }
.rp-actions .btn-dark { flex-grow: 1; height: 48px; font-size: 16px; }
.rp-note { margin: 0; font-size: 12px; line-height: 1.4; color: #6b5a4a; }
.rp-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.rp-ts:empty { display: none; }
.rp-sent { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.rp-sent p { margin: 0; line-height: 1.45; }
.report-slip { --bg: #fffaf0; }
.rr-reasons { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rr-reasons legend { margin-bottom: 4px; }
.rr-opt { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 6px 10px; border: 1.5px solid rgba(43,33,24,.25); border-radius: 8px; background: rgba(255,255,255,.55); font-size: 14.5px; font-weight: 600; cursor: pointer; }
.rr-opt.on { border-color: #2b1a0c; background: #fff; box-shadow: 0 0 0 2px rgba(253,224,106,.7); }
.rr-radio { width: 18px; height: 18px; margin: 0; flex-shrink: 0; accent-color: #2b1a0c; }
.rr-reasons.invalid .rr-opt { border-color: #b3261e; }
.rr-hint { margin: 0; padding: 8px 12px; background: #fdebc8; border-left: 4px solid #c07a12; color: #5c3500; font-size: 13.5px; font-weight: 800; }
.rr-details { height: 80px; }
.bc-report:disabled { cursor: default; text-decoration: none; color: #3e8e3a; font-weight: 800; }
.rp-sent-t { font-family: var(--font-hand); font-size: 32px; font-weight: 700; line-height: 1; }

.own-box { width: min(780px, calc(100% - 32px)); }
.own-body { gap: 16px; }
.own-intro { margin: 0; line-height: 1.5; }
.own-code-row { display: flex; gap: 8px; align-items: center; }
.own-code { max-width: 360px; height: 52px; font-size: 22px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.own-code::placeholder { letter-spacing: .04em; font-weight: 600; color: rgba(90,70,54,.45); }
.own-hint { margin: 0; font-size: 12.5px; line-height: 1.4; color: #6b5a4a; }
.own-ts:empty { display: none; }
.own-center { padding: 30px 0; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.own-center p { margin: 0; line-height: 1.45; max-width: 460px; }
.own-clock { font-size: 42px; font-weight: 900; font-variant-numeric: tabular-nums; }
.own-text { display: flex; flex-direction: column; gap: 10px; }
.own-text p { margin: 0; line-height: 1.45; }
.own-top { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px; align-items: start; }
.own-card-wrap {
  padding: 22px 16px 16px; border-radius: 6px;
  background-color: var(--cork);
  background-image:
    radial-gradient(circle at 20% 30%, rgba(92,52,20,.4) 0 1.3px, transparent 1.9px),
    radial-gradient(circle at 70% 60%, rgba(255,232,196,.3) 0 1px, transparent 1.6px);
  background-size: 11px 9px, 15px 17px;
  box-shadow: inset 0 2px 8px rgba(40,20,5,.4);
}
.card.own-card { position: relative; left: auto !important; top: auto !important; cursor: default; }
.card.own-card .tab { display: none !important; }
.card.faded { filter: grayscale(.6) opacity(.75); }
.own-card-empty { width: 240px; padding: 30px 16px; border: 2px dashed rgba(58,40,24,.3); border-radius: 6px; color: #6b5a4a; text-align: center; font-size: 13.5px; }
.own-status { display: flex; flex-direction: column; gap: 8px; }
.own-pill { align-self: flex-start; padding: 4px 10px; border-radius: 12px; font-size: 12.5px; font-weight: 900; letter-spacing: .03em; }
.st-ok { background: #dcefd6; color: #245c21; }
.st-wait { background: #fbe9c9; color: #7a4a06; }
.st-res { background: #f8d6d3; color: #8a1d16; }
.st-off { background: #e8e1d4; color: #5a4a3a; }
.st-adm { background: #f3d2cf; color: #7a1a14; }
.own-st-text { margin: 0; font-size: 15px; line-height: 1.45; }
.own-h { margin: 0; font-family: var(--font-hand); font-size: 22px; font-weight: 700; }
.own-replies, .own-manage { display: flex; flex-direction: column; gap: 10px; padding-top: 14px; border-top: 1.5px dashed rgba(58,40,24,.25); }
.own-reply { padding: 12px 14px; border-radius: 6px; background: #fffdf6; display: flex; flex-direction: column; gap: 6px; box-shadow: 0 1px 2px rgba(0,0,0,.12), 0 6px 10px -6px rgba(40,20,5,.4); }
.own-reply.new { box-shadow: inset 4px 0 0 #e2a92a, 0 2px 3px rgba(0,0,0,.15), 0 12px 20px -8px rgba(40,20,5,.55); }
.own-r-head { display: flex; align-items: baseline; gap: 8px; }
.own-new { padding: 1px 6px; border-radius: 3px; background: #e2a92a; color: #2b1a0c; font-size: 10.5px; font-weight: 900; letter-spacing: .08em; }
.own-when { margin-left: auto; font-size: 12px; color: #6b5a4a; white-space: nowrap; }
.own-r-msg { margin: 0; line-height: 1.45; white-space: pre-line; overflow-wrap: anywhere; }
.own-ct { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.own-ct-v { margin-right: 4px; font-weight: 800; overflow-wrap: anywhere; }
a.btn-ghost { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.own-r-foot { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; }
.own-spam, .own-del { color: #8a1d16; }
.own-del { align-self: flex-start; }
.own-okmsg { margin: 0; padding: 8px 12px; border-radius: 6px; background: #e6f2df; font-weight: 700; }
.own-ack { display: flex; gap: 8px; align-items: center; font-weight: 700; cursor: pointer; }
.own-ack input { width: 20px; height: 20px; margin: 0; accent-color: #b3261e; }
.btn-danger { height: 44px; padding: 0 18px; border: 0; border-radius: 6px; background: #b3261e; color: #fff; font-size: 15px; font-weight: 800; cursor: pointer; }
.own-toast {
  position: sticky; bottom: -24px; z-index: 3; margin: 0 -8px -8px;
  padding: 12px 16px; border-radius: 8px; background: #2b1a0c; color: #fff4e0;
  display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 700;
}
.own-toast .btn-link { color: #fde06a; }

.fb-overlay { z-index: 90; }
.fb-box { --bg: #fdf6e3; width: min(620px, calc(100% - 32px)); }
.fb-body { gap: 16px; }
.fb-intro { margin: 0; line-height: 1.45; }
.fb-group { display: flex; flex-direction: column; gap: 6px; border: 0; margin: 0; padding: 0; min-width: 0; }
.fb-label { font-size: 14.5px; }
.fb-rates { display: flex; gap: 8px; }
.fb-rate {
  width: 52px; height: 52px; border: 1.5px solid rgba(43,33,24,.35); border-radius: 50%;
  background: #fffdf6; color: var(--ink); font-family: var(--font-hand); font-size: 24px; font-weight: 700; cursor: pointer;
  transition: transform .12s ease, background-color .12s ease;
}
.fb-rate:hover { background: #fff; transform: translateY(-1px); }
.fb-rate.on { background: #fde06a; border-color: #2b1a0c; box-shadow: 0 0 0 2px rgba(43,26,12,.85); transform: rotate(-4deg); }
.fb-rate:focus-visible, .fb-topic:focus-within { outline: 3px solid #2b1a0c; outline-offset: 2px; }
.fb-hint { font-size: 12.5px; color: #6b5a4a; line-height: 1.35; }
.fb-topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 8px; }
.fb-topics legend { margin-bottom: 6px; }
.fb-text { height: 92px; }
.fb-note { font-size: 12.5px; }
.fb-ts:empty { display: none; }
.fb-sent .rp-sent-t { margin: 0; }
.fb-ask { font-weight: 800; line-height: 1.35; }
.fb-ask-b { display: flex; gap: 10px; flex-shrink: 0; }
.pin-foot .btn-link { font-size: 15px; }

@media (max-width: 1119px) {
  .overlay.replying .bigcard { margin-left: -280px; }
  .reply-slip { left: auto; right: 16px; top: auto; bottom: 16px; max-height: calc(100% - 32px); }
}
@media (max-width: 760px), (max-height: 520px) and (orientation: landscape) and (pointer: coarse) {
  .overlay.replying .bigcard { margin-left: 0; }
  .own-box, .fb-box { width: auto; }
  .fb-rates { gap: 6px; }
  .fb-rate { width: 48px; height: 48px; }
  .fb-topic-grid { grid-template-columns: 1fr; }
  .pin-foot:has(.fb-ask) { flex-direction: column; align-items: stretch; }
  .reply-slip {
    left: 0; right: 0; bottom: 0; top: auto; width: auto; max-height: 90%;
    padding: 16px 16px calc(16px + var(--safe-b));
    border-radius: 14px 14px 0 0; border-top: 0;
    animation: sheet-in .22s ease-out;
  }
  .own-top { grid-template-columns: 1fr; justify-items: center; gap: 16px; }
  .own-status { justify-self: stretch; }
  .own-code { font-size: 20px; }
  .own-toast { bottom: -20px; }
}
@media (max-height: 520px) and (orientation: landscape) and (pointer: coarse) {
  .reply-slip { left: 50%; right: auto; width: min(560px, 100%); transform: translateX(-50%); }
}
