/* V4 visual reference, scoped to the active judgment form. */
body:has(#v3-v32-wizard.active) { background:#eee5db; }
.app:has(#v3-v32-wizard.active) {
  --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;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.5 var(--sans);
  overflow:clip;
}
.app:has(#v3-v32-wizard.active) > .topbar { display:none; }
.app:has(#v3-v32-wizard.active) > .v3-main { padding:0; flex:1 0 auto; }
#v3-v32-wizard {
  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 250px 240px at 100% 0, #f8e7df, transparent);
}
#v3-v32-wizard .v4-judgment-intro { position:relative; margin:14px 0 21px; }
#v3-v32-wizard .v4-judgment-back {
  min-height:44px; padding:0; border:0; background:none; color:var(--wine);
  font:650 .875rem/1.4 var(--sans);
}
#v3-v32-wizard .v4-judgment-back span { margin-right:4px; }
#v3-v32-wizard .v4-judgment-kicker {
  display:flex; align-items:center; gap:8px; color:#955d40;
  font-size:.66rem; font-weight:750; letter-spacing:.1em;
}
#v3-v32-wizard .v4-judgment-kicker::before { content:""; width:20px; border-top:1px solid #c99e78; }
#v3-v32-wizard .v4-judgment-intro h1 {
  margin:5px 55px 0 0; color:#4b3435;
  font:900 clamp(24px, 7.2vw, 32px)/1.4 var(--serif); letter-spacing:.025em;
}
#v3-v32-wizard .v4-judgment-intro p {
  margin:7px 54px 0 0; color:var(--muted); font-size:.81rem; line-height:1.6;
}
#v3-v32-wizard .v4-judgment-sticker {
  position:absolute; right:4px; bottom:6px; width:clamp(41px, 13vw, 58px);
  aspect-ratio:1; display:grid; place-items:center; transform:rotate(8deg);
  border:1px solid #deb2ac; border-radius:12px; background:#fae3db;
  color:#a55164; box-shadow:4px 4px 0 #edd5ce; pointer-events:none;
}
#v3-v32-wizard .v4-judgment-sticker svg { width:66%; }

#v32-case-form { display:grid; gap:12px; }
#v32-case-form [hidden] { display:none; }
#v32-case-form p { margin-block:0; }
#v32-case-form :is(.v4-party-card,.v4-field-card,.v32-advanced) {
  min-width:0; padding:14px; border:1px solid var(--line); border-radius:18px;
  background:var(--paper); box-shadow:0 4px 15px #9a66580a;
}
#v32-case-form .v4-party-card { background:linear-gradient(140deg,#f9e6df,#f6ded7); border-color:#ecd0c6; }
#v32-case-form .v4-section-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; }
#v32-case-form .v4-section-heading h2 { margin:0; font-size:.95rem; color:#573b38; }
#v32-case-form .v4-section-heading span {
  color:#895b50; font:700 .65rem/1.2 Georgia,serif; letter-spacing:.08em; white-space:nowrap;
}
#v32-case-form .v4-quest-heading { margin:6px 2px 0; }
#v32-case-form .v4-quest-heading span { padding:5px 7px; border:1px dashed #dcbfae; border-radius:7px; background:#fbf2e8; }
#v32-case-form .v32-parties {
  display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:end; gap:9px; margin:9px 0 7px;
}
#v32-case-form .v32-parties label { color:#795b55; font-size:.76rem; font-weight:700; }
#v32-case-form .v32-parties span { display:grid; place-items:center; height:44px; color:var(--wine); font:800 1.13rem/1 var(--serif); }
#v32-case-form .v32-parties input { text-align:center; margin-top:4px; padding-block:5px; background:#fffdf9; border-color:#e5c8c0; }
#v32-case-form .v4-field-card:focus-within { border-color:#cda39c; box-shadow:0 6px 18px #9a665816; }
#v32-case-form .v4-field-heading {
  display:flex; align-items:center; gap:8px; margin-bottom:9px; font-size:.96rem; font-weight:750;
}
#v32-case-form .v4-field-number {
  flex:none; padding:4px 6px; border-radius:6px; background:#f6e5df; color:var(--wine);
  font:700 .72rem/1.3 Georgia,serif;
}
#v32-case-form .v4-field-help { color:var(--muted); font-size:.75rem; }
#v32-case-form .v4-field-card .v4-field-help { margin-top:5px; }
#v32-case-form :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);
}
#v32-case-form :is(input,textarea)::placeholder { color:#806b61; opacity:1; }
#v32-case-form .v3-textarea {
  field-sizing:content; min-height:66px; max-height:min(15rem,45svh);
  resize:vertical; overflow-y:auto;
}
#v32-case-form :is(.v3-label,.v32-grid label) { margin:0; color:var(--ink); font-size:.84rem; font-weight:650; }
#v32-case-form .v4-custom-case { margin-top:10px; }
#v32-case-form :is(.v3-label,.v32-grid label)>:is(input,select,textarea) { margin-top:5px; }
#v32-case-form .v323-form-error { margin-top:6px; }

#v32-case-form .v32-advanced { margin:2px 0 0; padding:0 14px; }
#v32-case-form .v32-advanced[open] { padding-bottom:14px; }
#v32-case-form summary::marker { content:""; }
#v32-case-form summary::-webkit-details-marker { display:none; }
#v32-case-form summary::after {
  content:""; width:8px; height:8px; flex:none; margin-left:auto; margin-right:4px;
  border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg);
}
#v32-case-form details[open]>summary::after { transform:rotate(225deg); }
#v32-case-form .v32-advanced>summary { min-height:65px; gap:9px; font-size:.89rem; }
#v32-case-form .v32-advanced>summary small { display:block; margin-top:2px; font-size:.73rem; color:var(--muted); font-weight:400; }
#v32-case-form .v32-advanced[open]>summary { margin-bottom:10px; }
#v32-case-form .v4-option-icon {
  flex:none; display:grid; place-items:center; width:34px; height:34px;
  border-radius:10px; color:var(--wine); background:#f7e7e1;
}
#v32-case-form .v4-option-icon svg { width:18px; }
#v32-case-form .v32-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:11px; }
#v32-case-form .v32-grid>label:has([data-v32field="remedy"]) { grid-column:1/-1; }
#v32-case-form .v4-law-panel {
  margin-top:13px; padding:11px; border:1px solid var(--line); border-radius:12px; background:#fcf5ee;
}
#v32-case-form .v4-law-heading { display:flex; align-items:center; gap:8px; }
#v32-case-form .v4-law-heading .v4-option-icon { width:29px; height:29px; font:700 1rem/1 Georgia,serif; }
#v32-case-form .v4-law-heading h3 { margin:0 0 2px; font:700 .87rem/1.45 var(--sans); }
#v32-case-form [data-case-rule-status] { font-size:.8rem; color:var(--muted); overflow-wrap:anywhere; }
#v32-case-form .v32-rule-picker>summary { width:fit-content; max-width:100%; gap:9px; color:var(--wine); font-size:.84rem; }
#v32-case-form .v32-rule-card { border-color:var(--line); background:var(--paper); overflow-wrap:anywhere; }
#v32-case-form .v32-rule-card input { flex:none; accent-color:var(--wine); }
#v32-case-form .v32-rule-card .v32-citation-content { display:block; margin-top:4px; }
#v32-case-form .text-link { min-height:44px; color:var(--wine); }
#v32-case-form .v4-judgment-submit {
  display:flex; align-items:center; justify-content:center; gap:10px; min-height:52px;
  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;
}
#v32-case-form .v4-judgment-submit:hover { background:var(--wine-dark); }
#v32-case-form .v4-judgment-submit:active { transform:translateY(2px); box-shadow:0 3px 0 #743044; }
#v32-case-form :is([data-case-draft-status],#v32-post-edit-hint) { text-align:center; color:var(--muted); }
#v32-case-form #v32-post-edit-hint { padding:0; font-size:.8rem; }
#v32-case-form [data-case-draft-status] { margin-top:-6px; }
#v3-v32-wizard :is(button,input,select,textarea,summary):focus-visible {
  outline:2px solid #ad6573; outline-offset:2px;
}

.app:has(#v3-v32-wizard.active) > .bottom-nav,
.app:has(#v3-v32-wizard.active) > .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-v32-wizard.active) :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-v32-wizard.active) :is(.desktop-nav,.bottom-nav) button[data-v3screen="home"] { color:var(--wine); }
.app:has(#v3-v32-wizard.active) :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-v32-wizard.active) :is(.desktop-nav,.bottom-nav) .v5-nav-icon { display:block; width:21px; height:21px; stroke-width:1.8; }
.app:has(#v3-v32-wizard.active) :is(.desktop-nav,.bottom-nav) .v5-nav-caption { display:block; }
.app:has(#v3-v32-wizard.active) :is(.desktop-nav,.bottom-nav) .v5-nav-original { display:none; }

@media (min-width:768px) {
  body:has(#v3-v32-wizard.active) {
    padding:42px 25px;
    background:radial-gradient(circle at 24% 22%,#f5dcd4,transparent 26%),#eee9e2;
  }
  .app:has(#v3-v32-wizard.active) {
    width:430px; border-radius:30px; border:7px solid #fdf9f4;
    box-shadow:0 26px 75px #76574a35,0 0 0 1px #d9cbc1;
  }
  .app:has(#v3-v32-wizard.active) > .topbar { display:contents; }
  .app:has(#v3-v32-wizard.active) > .topbar > :not(.desktop-nav) { display:none; }
  .app:has(#v3-v32-wizard.active) > .topbar > .desktop-nav { display:grid; order:1; }
  .app:has(#v3-v32-wizard.active) > .bottom-nav { display:none; }
}
