/* WANTED and penalty form skins. Finished documents use their existing styles. */
body:has(#v3-quick.active > .quick-form-v4) { background:#eee5db; }
.app:has(#v3-quick.active > .quick-form-v4) {
  --bg:#faf6ef; --paper:#fffdf9; --ink:#46352f; --muted:#79665e;
  --wine:#873a4c; --wine-dark:#702b3e; --line:#eadbd0;
  --serif:"Songti SC","Noto Serif CJK SC","STSong","SimSun",serif;
  --sans:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif;
  width:100%; max-width:480px; min-height:100vh; min-height:100dvh; margin:0 auto;
  display:flex; flex-direction:column; overflow:clip;
  background:var(--bg); color:var(--ink); font:16px/1.5 var(--sans);
}
.app:has(#v3-quick.active > .quick-form-v4) > .topbar { display:none; }
.app:has(#v3-quick.active > .quick-form-v4) > .v3-main { padding:0; flex:1 0 auto; }
.quick-form-v4 {
  --theme-ink:#674b38; --theme-soft:#f0e5d7; --theme-edge:#a47e60; --theme-glow:#f2e3cf;
  padding:calc(24px + env(safe-area-inset-top, 0px))
    max(clamp(15px, 5vw, 24px), env(safe-area-inset-right, 0px)) 28px
    max(clamp(15px, 5vw, 24px), env(safe-area-inset-left, 0px));
  background:radial-gradient(ellipse 260px 255px at 100% 0,var(--theme-glow),transparent);
}
.quick-form-v4[data-document-type="penalty"] {
  --theme-ink:#4e6858; --theme-soft:#edf1e8; --theme-edge:#91a995; --theme-glow:#e4ebdd;
}
.quick-form-v4 .quick-v4-intro { position:relative; margin:14px 0 17px; }
.quick-form-v4 .quick-v4-back {
  min-height:44px; padding:0; border:0; background:none; color:var(--wine);
  font:650 .875rem/1.4 var(--sans);
}
.quick-form-v4 .quick-v4-kicker {
  display:flex; align-items:center; gap:8px; color:var(--theme-ink);
  font-size:.66rem; font-weight:750; letter-spacing:.1em;
}
.quick-form-v4 .quick-v4-kicker::before { content:""; width:20px; border-top:1px solid var(--theme-edge); }
.quick-form-v4 h1 {
  margin:5px 57px 0 0; color:#4b3435;
  font:900 clamp(23px,7vw,32px)/1.4 var(--serif); letter-spacing:.025em;
}
.quick-form-v4 .quick-v4-intro p { margin:7px 62px 0 0; color:var(--muted); font-size:.81rem; line-height:1.6; }
.quick-form-v4 .quick-v4-sticker {
  position:absolute; right:4px; bottom:6px; width:clamp(41px,13vw,58px); aspect-ratio:1;
  display:grid; place-items:center; transform:rotate(8deg); pointer-events:none;
  border:1px solid var(--theme-edge); border-radius:13px; color:var(--theme-ink);
  background:var(--theme-soft); box-shadow:4px 4px 0 var(--theme-glow);
}
.quick-form-v4 .quick-v4-sticker svg { width:68%; }
.quick-form-v4 .quick-v4-flair {
  display:flex; align-items:center; gap:10px; min-height:35px; margin:0 0 13px; padding:5px 10px;
  border:1px dashed var(--theme-edge); border-radius:7px; background:var(--theme-soft);
  color:var(--theme-ink); font-size:.76rem; letter-spacing:.05em;
}
.quick-form-v4 .quick-v4-flair b { font:800 .87rem/1.3 Georgia,serif; }
.quick-form-v4 .quick-v4-flair span:last-child { margin-inline-start:auto; }
.quick-form-v4[data-document-type="penalty"] .quick-v4-flair::before {
  content:""; width:7px; height:7px; border:1px solid var(--theme-edge); border-radius:50%; background:var(--paper);
}
.quick-form-v4 .template-switch { margin:0 0 14px; padding:0; display:flex; flex-wrap:wrap; gap:7px; }
.quick-form-v4 .template-switch button {
  min-height:44px; padding:6px clamp(10px,3vw,15px); border:1px solid #dfcfc3;
  border-radius:999px; background:var(--paper); color:#725952; font:700 .81rem/1.4 var(--sans);
}
.quick-form-v4 .template-switch button.active { background:var(--theme-ink); border-color:var(--theme-ink); color:#fff; }
.quick-form-v4 .quick-v4-sheet {
  padding:13px; border:1px solid var(--line); border-top:3px solid var(--theme-edge);
  border-radius:22px; background:var(--paper); box-shadow:0 10px 28px #7d5a4e0a;
}
.quick-form-v4 .quick-v4-sheet-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:1px 1px 12px; }
.quick-form-v4 .quick-v4-sheet-head h2 { display:flex; align-items:center; gap:8px; margin:0; font:750 .94rem/1.4 var(--sans); }
.quick-form-v4 .quick-v4-sheet-head h2 span {
  display:grid; place-items:center; width:29px; height:29px; border-radius:5px;
  background:var(--theme-ink); color:#fff; font:700 .95rem/1 Georgia,serif;
}
.quick-form-v4 .quick-v4-sheet-head > span {
  padding:5px 7px; border:1px dashed var(--theme-edge); border-radius:7px; background:var(--theme-soft);
  color:var(--theme-ink); font:700 .65rem/1.25 Georgia,serif; letter-spacing:.06em; white-space:nowrap;
}
.quick-form-v4 .quick-v4-fields { display:grid; gap:10px; }
.quick-form-v4 .quick-v4-field {
  display:grid; gap:8px; min-width:0; padding:11px; border:1px solid var(--line);
  border-radius:16px; background:var(--paper); box-shadow:0 4px 15px #9a66580a;
}
.quick-form-v4 .quick-v4-field:focus-within { border-color:var(--theme-edge); }
.quick-form-v4 .quick-v4-field-head { display:flex; align-items:center; gap:7px; flex-wrap:wrap; font-size:.91rem; font-weight:750; }
.quick-form-v4 .quick-v4-field-num {
  padding:4px 6px; border-radius:5px; background:var(--theme-soft); color:var(--theme-ink);
  font:700 .72rem/1.3 Georgia,serif;
}
.quick-form-v4 :is(.v3-input,.v3-select,.v3-textarea) {
  display:block; width:100%; min-width:0; min-height:44px; padding:8px 10px;
  border:1px solid #e5d5ca; border-radius:11px; background:#fcf7f1; color:var(--ink);
  font:400 1rem/1.5 var(--sans); scroll-margin-block:16px 80px;
}
.quick-form-v4 .v3-textarea { field-sizing:content; min-height:72px; max-height:min(13rem,45svh); resize:vertical; overflow-y:auto; }
.quick-form-v4 :is(input,textarea)::placeholder { color:#806b61; opacity:1; }
.quick-form-v4 :is(button,input,select,textarea,summary):focus-visible { outline:2px solid var(--theme-edge); outline-offset:2px; }
.quick-form-v4 .quick-v4-submit {
  width:100%; min-height:52px; margin-top:15px; border:1px solid var(--wine);
  border-radius:13px; background:var(--wine); color:#fff; font:750 1rem/1.4 var(--sans);
  box-shadow:0 5px 0 #743044,0 9px 16px #8c405022;
}
.quick-form-v4 .quick-v4-submit:hover { background:var(--wine-dark); }
.quick-form-v4 .quick-v4-submit span { margin-left:7px; }
.quick-form-v4 .quick-v4-note { margin:12px 0 0; text-align:center; color:var(--muted); font-size:.78rem; }
.quick-form-v4 .wanted-reward-inputs { grid-template-columns:minmax(86px,auto) minmax(0,1fr); align-items:start; gap:8px; }
.quick-form-v4 .wanted-reward-inputs .v3-select { padding-inline:7px; font-size:.9rem; }
.quick-form-v4 .quick-v4-reward-help { margin:0; color:var(--muted); font-size:.74rem; }
.quick-form-v4 .wanted-extra { margin:2px 0 0; padding:0 11px; border-color:var(--line); border-radius:15px; background:#fbf5eb; }
.quick-form-v4 .wanted-extra > summary { min-height:53px; padding:8px 0; color:var(--theme-ink); font-size:.87rem; font-weight:750; }
.quick-form-v4 .wanted-extra[open] { padding-bottom:11px; }
.quick-form-v4 .wanted-extra-fields { display:grid; gap:10px; padding:0; }
.quick-form-v4 .wanted-extra-fields label { display:grid; gap:5px; font-size:.82rem; font-weight:650; }
.quick-form-v4 .wanted-photo-field { padding:9px; border:1px dashed var(--theme-edge); border-radius:11px; background:var(--paper); }
.quick-form-v4 .wanted-photo-field input { padding:6px; font-size:.81rem; }
.quick-form-v4 .wanted-photo-field input::file-selector-button {
  border:0; padding:7px 8px; margin-inline-end:7px; border-radius:6px;
  background:var(--theme-soft); color:var(--theme-ink); font:700 .77rem/1.25 var(--sans); cursor:pointer;
}
.quick-form-v4 .wanted-photo-field [hidden] { display:none; }
.quick-form-v4 .wanted-photo-field .helper { color:var(--muted); }

.app:has(#v3-quick.active > .quick-form-v4) > .bottom-nav,
.app:has(#v3-quick.active > .quick-form-v4) > .topbar > .desktop-nav {
  position:sticky; inset:auto 0 0; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0;
  height:auto; padding:8px 16px calc(11px + env(safe-area-inset-bottom, 0px));
  background:#fffdf9f5; border-top:1px solid #eaded4; z-index:4;
}
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) button {
  position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:44px; gap:4px; padding:3px 6px; color:#786a60; background:none; border:0;
  font:650 .69rem/1.3 var(--sans);
}
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) button[data-v3screen="home"] { color:var(--wine); }
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) button[data-v3screen="home"]::after {
  content:""; position:absolute; bottom:-4px; width:4px; height:4px; border-radius:50%; background:#aa5061;
}
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) .v5-nav-icon { display:block; width:21px; height:21px; stroke-width:1.8; }
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) .v5-nav-caption { display:block; }
.app:has(#v3-quick.active > .quick-form-v4) :is(.desktop-nav,.bottom-nav) .v5-nav-original { display:none; }
@media (max-width:767px) and (pointer:coarse) {
  .app:has(#v3-quick.active > .quick-form-v4 :is(input,textarea):focus) > .bottom-nav { position:static; }
}
@media (min-width:768px) {
  body:has(#v3-quick.active > .quick-form-v4) {
    padding:42px 25px; background:radial-gradient(circle at 24% 22%,#f2e1d3,transparent 26%),#eee9e2;
  }
  .app:has(#v3-quick.active > .quick-form-v4) {
    width:430px; border-radius:30px; border:7px solid #fdf9f4;
    box-shadow:0 26px 75px #76574a35,0 0 0 1px #d9cbc1;
  }
  .app:has(#v3-quick.active > .quick-form-v4) > .topbar { display:contents; }
  .app:has(#v3-quick.active > .quick-form-v4) > .topbar > :not(.desktop-nav) { display:none; }
  .app:has(#v3-quick.active > .quick-form-v4) > .topbar > .desktop-nav { display:grid; order:1; }
  .app:has(#v3-quick.active > .quick-form-v4) > .bottom-nav { display:none; }
}
