@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap');

#pv-shindan-root{
  --bg:#ffffff;
  --panel:#ffffff;
  --panel-line:#e6e3d9;
  --gold:#00a8e1;
  --gold-dim:#7fd4f0;
  --ink:#26241c;
  --ink-dim:#7a7669;
  --a:#a6423a; --b:#3d6e86; --c:#9c6b8b; --d:#4f6b52; --e:#c98a3b;
  font-family:'Zen Kaku Gothic New',sans-serif;
  color:var(--ink);
  line-height:1.7;
}
#pv-shindan-root *{ box-sizing:border-box; }
.pv-card{
  width:100%; max-width:600px; margin:0 auto;
  background:var(--panel); border:1px solid var(--panel-line);
  border-radius:18px; padding:40px 32px; position:relative; overflow:hidden;
  box-shadow:0 2px 24px rgba(40,35,20,0.06);
}
.pv-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,var(--a),var(--b),var(--c),var(--d),var(--e));
}
.pv-eyebrow{ font-size:14px; color:var(--gold); margin:0 0 6px; }
.pv-title{ font-family:'Fraunces',serif; font-weight:600; font-size:30px; margin:0 0 28px; }
.pv-dots{ display:flex; gap:7px; margin-bottom:32px; }
.pv-dot{ width:100%; height:4px; border-radius:2px; background:var(--panel-line); transition:background .3s; }
.pv-dot.done{ background:var(--gold); }
.pv-qnum{ font-size:14px; color:var(--ink-dim); margin:0 0 10px; }
.pv-question{ font-family:'Fraunces',serif; font-size:22px; font-weight:500; margin:0 0 26px; line-height:1.5; }
.pv-options{ display:flex; flex-direction:column; gap:10px; }
.pv-opt{
  text-align:left; background:transparent; border:1px solid var(--panel-line); color:var(--ink);
  padding:16px 18px; border-radius:12px; font-size:16px; font-family:inherit; cursor:pointer;
  transition:border-color .2s, background .2s, transform .15s;
}
.pv-opt:hover{ border-color:var(--gold-dim); background:rgba(0,168,225,0.06); }
.pv-opt:active{ transform:scale(0.99); }
.pv-nav{ margin-top:24px; display:flex; justify-content:space-between; align-items:center; }
.pv-back{ background:none; border:none; color:var(--ink-dim); font-size:14px; cursor:pointer; font-family:inherit; padding:6px 0; }
.pv-back:hover{ color:var(--ink); }
.pv-back:disabled{ visibility:hidden; }
.pv-result{ display:none; }
.pv-result.show{ display:block; animation:pv-reveal .5s ease; }
@keyframes pv-reveal{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:translateY(0);} }
.pv-result-badge{ display:inline-block; font-size:14px; font-weight:700; padding:5px 14px; border-radius:999px; margin-bottom:16px; }
.pv-result-title{ font-family:'Fraunces',serif; font-weight:600; font-size:26px; margin:0 0 14px; line-height:1.4; }
.pv-result-desc{ color:var(--ink-dim); font-size:15px; margin:0 0 26px; }
.pv-worklist{ display:flex; flex-direction:column; gap:12px; margin-bottom:28px; }
.pv-work{ border:1px solid var(--panel-line); border-radius:12px; padding:14px 16px; display:flex; gap:12px; }
.pv-work img{ width:64px; height:64px; object-fit:cover; border-radius:8px; flex-shrink:0; background:#f2f0e9; }
.pv-work-body{ flex:1; min-width:0; }
.pv-work-name{ font-weight:700; font-size:16px; margin:0 0 4px; }
.pv-work-note{ font-size:14px; color:var(--ink-dim); margin:0 0 10px; }
.pv-work-link{ display:inline-block; font-size:13px; font-weight:700; color:var(--gold); text-decoration:none; border-bottom:1px solid var(--gold-dim); }
.pv-work-link:hover{ color:#0080ad; border-color:var(--gold); }
.pv-restart{
  width:100%; background:var(--gold); color:#fff; border:none; border-radius:12px;
  padding:15px 18px; font-size:16px; font-weight:700; font-family:inherit; cursor:pointer;
}
.pv-restart:hover{ filter:brightness(1.08); }
.pv-visual{ width:100%; height:180px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:22px; border:1px solid var(--panel-line); overflow:hidden; }
.pv-visual svg{ width:100%; height:100%; }
.pv-note, .pv-affiliate-note{ font-size:12px; color:var(--ink-dim); text-align:center; margin:6px 0 0; }
@media (max-width:480px){
  .pv-card{ padding:28px 20px; }
  .pv-title{ font-size:24px; }
  .pv-question{ font-size:19px; }
  .pv-visual{ height:150px; }
}
