/* ================= 第六幕 恋爱合约 ================= */
#ch-contract { padding: calc(var(--vh) * 12) 0 calc(var(--vh) * 10); }
.lc-wrap { display: flex; flex-direction: column; align-items: center; gap: 22px; }
.lc-paper { width: min(100%, 520px); padding: 24px 22px 22px; transform: rotate(-.6deg); color: var(--ink); }
.lc-paper::before { content: ''; position: absolute; inset: 9px; border: 1.5px solid rgba(42, 26, 18, .28); border-radius: 12px 16px 10px 14px; pointer-events: none; }
.lc-top { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-bottom: 14px; }
.lc-h { font-weight: normal; font-size: clamp(30px, 8.6vw, 40px); color: #d8344f; letter-spacing: .12em; line-height: 1.2; }
.lc-no { font-size: 12px; color: var(--ink2); letter-spacing: .14em; font-weight: 500; }
.lc-parties { display: flex; flex-direction: column; gap: 2px; font-size: 16px; }
.lc-parties u { text-decoration: none; border-bottom: 2px solid rgba(42, 26, 18, .6); padding: 0 6px; font-size: 18px; }
.lc-intro { margin: 10px 0 8px; font-size: 14.5px; color: var(--ink2); }
.lc-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.lc-list li { display: flex; gap: 8px; font-size: 15.5px; line-height: 1.6; }
.lc-list li b { flex: none; font-weight: normal; color: #d8344f; font-size: 15px; padding-top: 1px; }
.lc-list li span { word-break: keep-all; overflow-wrap: anywhere; }
.lc-sign { position: relative; display: grid; grid-template-columns: 1.25fr 1fr; gap: 12px; margin-top: 18px; padding-top: 14px; border-top: 2px dashed rgba(42, 26, 18, .3); }
.lc-lab { display: block; font-size: 13px; color: var(--ink2); margin-bottom: 4px; }
.lc-pad { position: relative; height: 104px; border-radius: 10px; border: 2.5px dashed rgba(42, 26, 18, .5); background: rgba(255, 255, 255, .55) repeating-linear-gradient(transparent 0 70px, rgba(216, 52, 79, .35) 70px 72px, transparent 72px); touch-action: none; cursor: crosshair; overflow: hidden; }
.lc-pad canvas, .lc-pad .lc-sigimg { position: absolute; inset: 0; width: 100%; height: 100%; }
.lc-sigimg:not([src]) { display: none; }
.lc-pad.locked { border-style: solid; border-color: rgba(42, 26, 18, .25); background-color: transparent; cursor: default; }
.lc-ph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 10px; font-size: 14px; color: rgba(42, 26, 18, .5); pointer-events: none; transition: opacity .4s; }
.lc-ph.gone { opacity: 0; }
.lc-padbtn { display: flex; gap: 8px; margin-top: 8px; transition: opacity .4s; }
.lc-padbtn .btn { padding: 6px 13px; font-size: 13.5px; }
.lc-pad.locked + .lc-padbtn { opacity: 0; pointer-events: none; }
.lc-sb { display: flex; flex-direction: column; }
.lc-his { font-weight: normal; font-size: clamp(20px, 5.6vw, 26px); line-height: 1.25; margin-top: 18px; transform: rotate(-4deg); transform-origin: 0 50%; color: #3a2418; }
.lc-date { margin-top: auto; font-size: 13px; color: var(--ink2); }
.lc-seal { position: absolute; right: 6%; bottom: 7%; width: 112px; height: 112px; mix-blend-mode: multiply; pointer-events: none; opacity: 0; transform: scale(2) rotate(-24deg); display: none; }
.lc-paper.stamped .lc-seal[src] { display: block; }
.lc-paper.stamped .lc-seal { animation: lc-stamp .55s cubic-bezier(.5, 0, .7, 1) forwards; }
.lc-paper.stamped.was .lc-seal { animation: none; opacity: .93; transform: rotate(-8deg); }
.lc-paper.stamped:not(.was) { animation: lc-thump .5s ease-out .33s; }
@keyframes lc-stamp { 0% { opacity: 0; transform: scale(2) rotate(-24deg); } 60% { opacity: 1; transform: scale(.94) rotate(-6deg); } 80% { transform: scale(1.03) rotate(-8deg); } 100% { opacity: .93; transform: rotate(-8deg); } }
@keyframes lc-thump { 0% { transform: rotate(-.6deg); } 30% { transform: rotate(-.6deg) translateY(3px) scale(.995); } 60% { transform: rotate(-.9deg) translateY(-1px); } 100% { transform: rotate(-.6deg); } }
.lc-act { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px; }
.lc-save, .lc-redo { display: none; }
#ch-contract[data-st='sealed'] .lc-save { display: inline-flex; }
#ch-contract[data-st='sealed'] .lc-redo { display: inline-block; }
.lc-redo { font-size: 13px; color: var(--txt2); text-decoration: underline; text-underline-offset: 3px; padding: 6px; }
#ch-contract[data-st='sealed'] .lc-stamp { background-color: #9ee28f; }
/* phones: her signature box gets the whole width, his signature sits underneath */
@media (max-width: 520px) {
  .lc-sign { grid-template-columns: 1fr; gap: 10px; }
  .lc-pad { height: 120px; }
  .lc-sb { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: end; }
  .lc-sb .lc-lab { grid-column: 1 / -1; }
  .lc-his { margin-top: 2px; }
  .lc-date { margin: 0 0 4px; justify-self: end; }
  .lc-seal { right: 4%; bottom: 3%; width: 104px; height: 104px; }
}