/* Daily literature question card in the Catch feed (4.17) — inc/daily-question.php */
.wn-dq-slot{ min-width:0; }
.wn-dq{
  --dq-bg:#FFF6D6; --dq-edge:var(--gold,#F7C600); --dq-ok:var(--leaf-deep,#3F8459); --dq-ok-bg:#E4F2E8;
  --dq-bad:var(--rose-deep,#D3486C); --dq-bad-bg:#FBE6EC;
  background:var(--dq-bg); border:1.5px solid var(--dq-edge); border-radius:16px;
  padding:18px 18px 16px; display:flex; flex-direction:column; gap:14px; min-width:0;
  color:var(--ink,#120A08);
}
[data-theme="dark"] .wn-dq{ --dq-bg:#2A2410; --dq-ok-bg:#1D3326; --dq-bad-bg:#3A1C25; --dq-ok:#7CC696; --dq-bad:#F08AA6; }
.wn-dq--pop{ animation:wn-dq-pop .35s ease; }
@keyframes wn-dq-pop{ 0%{ transform:scale(.985); } 60%{ transform:scale(1.01); } 100%{ transform:none; } }
@media (prefers-reduced-motion: reduce){ .wn-dq--pop{ animation:none; } }

.wn-dq-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.wn-dq-label{ display:flex; align-items:center; gap:8px; color:var(--clay-deep,#C64F1E); font-weight:700; font-size:1rem; }
.wn-dq-label svg{ flex:none; }
.wn-dq-streak{ font-size:.8rem; font-weight:700; background:var(--white,#fff); border:1px solid var(--line,#E7E0D2); border-radius:999px; padding:3px 10px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.wn-dq-q{ margin:0; font-size:1.25rem; font-weight:700; line-height:1.45; text-wrap:balance; }

.wn-dq-opts{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
@media (max-width:480px){ .wn-dq-opts{ grid-template-columns:1fr; } }
.wn-dq-opt{
  display:flex; align-items:center; gap:10px; min-width:0; text-align:left; cursor:pointer;
  background:var(--white,#fff); color:var(--ink,#120A08); border:1.5px solid var(--line,#E7E0D2); border-radius:12px;
  padding:10px 12px; font:inherit; font-size:1rem; font-weight:600; transition:border-color .15s, transform .1s;
}
.wn-dq-opt:hover:not([disabled]){ border-color:var(--clay,#E86A33); }
.wn-dq-opt:active:not([disabled]){ transform:scale(.98); }
.wn-dq-opt:focus-visible, .wn-dq button:focus-visible, .wn-dq textarea:focus-visible{ outline:2px solid var(--clay,#E86A33); outline-offset:2px; }
.wn-dq-opt[disabled]{ cursor:default; }
.wn-dq-opt.is-busy{ opacity:.6; }
.wn-dq-k{ flex:none; width:24px; height:24px; border-radius:50%; background:var(--paper-deep,#F4EEE0); display:grid; place-items:center; font-size:.8rem; color:var(--ink-soft,#3A362F); }
.wn-dq-o{ min-width:0; overflow-wrap:anywhere; }
.wn-dq-pct{ margin-left:auto; font-size:.75rem; color:var(--ink-soft,#3A362F); font-variant-numeric:tabular-nums; }
.wn-dq-opt.right{ border-color:var(--dq-ok); background:var(--dq-ok-bg); }
.wn-dq-opt.right .wn-dq-k{ background:var(--dq-ok); color:#fff; }
.wn-dq-opt.wrong{ border-color:var(--dq-bad); background:var(--dq-bad-bg); }
.wn-dq-opt.wrong .wn-dq-k{ background:var(--dq-bad); color:#fff; }
.wn-dq-opt.dim{ opacity:.55; }

.wn-dq-result{ display:flex; flex-direction:column; gap:6px; border-top:1px dashed var(--dq-edge); padding-top:12px; }
.wn-dq-verdict{ font-weight:700; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.wn-dq-verdict.ok{ color:var(--dq-ok); } .wn-dq-verdict.bad{ color:var(--dq-bad); }
.wn-dq-ak{ background:var(--ink,#120A08); color:var(--gold,#F7C600); border-radius:999px; padding:2px 10px; font-size:.78rem; font-weight:700; white-space:nowrap; }
.wn-dq-stat{ margin:0; font-size:.82rem; color:var(--ink-soft,#3A362F); }
.wn-dq-fact{ margin:0; font-size:1rem; line-height:1.65; }
.wn-dq-fact a{ color:var(--clay-deep,#C64F1E); font-weight:600; text-decoration:none; }
.wn-dq-next{ display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; font-size:.82rem; color:var(--ink-soft,#3A362F); }
.wn-dq-next b{ color:var(--ink,#120A08); font-variant-numeric:tabular-nums; }
.wn-dq-week{ display:flex; gap:5px; }
.wn-dq-week i{ width:22px; height:22px; border-radius:6px; background:var(--white,#fff); border:1px solid var(--line,#E7E0D2); display:grid; place-items:center; font-style:normal; font-size:.7rem; color:var(--ink-soft,#3A362F); }
.wn-dq-week i.ok{ background:var(--dq-ok); border-color:var(--dq-ok); color:#fff; }
.wn-dq-week i.done{ background:var(--dq-ok-bg); border-color:var(--dq-ok); color:var(--dq-ok); }
.wn-dq-week i.today{ outline:2px solid var(--clay,#E86A33); outline-offset:1px; }

.wn-dq-signup{ background:var(--white,#fff); border:1px solid var(--line,#E7E0D2); border-radius:12px; padding:10px 12px; display:flex; gap:10px; align-items:center; justify-content:space-between; flex-wrap:wrap; font-size:.92rem; }
.wn-dq-signin, .wn-dq-send{ background:var(--clay,#E86A33); color:#fff; border:0; border-radius:999px; padding:7px 16px; font:inherit; font-weight:700; font-size:.85rem; cursor:pointer; }
.wn-dq-send[disabled]{ opacity:.45; cursor:default; }

.wn-dq-sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }
.wn-dq-write{ display:flex; flex-direction:column; gap:8px; }
.wn-dq-write textarea{ width:100%; min-height:120px; resize:vertical; box-sizing:border-box; border:1.5px solid var(--line,#E7E0D2); border-radius:12px; padding:10px 12px; background:var(--white,#fff); color:var(--ink,#120A08); font:inherit; font-size:1rem; line-height:1.6; }
.wn-dq-write textarea:focus{ outline:none; border-color:var(--clay,#E86A33); }
.wn-dq-write-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:.82rem; color:var(--ink-soft,#3A362F); }
.wn-dq-meter{ display:flex; align-items:center; gap:8px; font-variant-numeric:tabular-nums; }
.wn-dq-bar{ width:90px; height:6px; border-radius:99px; background:var(--paper-deep,#F4EEE0); overflow:hidden; }
.wn-dq-bar i{ display:block; height:100%; width:0; background:var(--clay,#E86A33); transition:width .15s; }
.wn-dq-meter.done{ color:var(--dq-ok); font-weight:700; }
.wn-dq-meter.done .wn-dq-bar i{ background:var(--dq-ok); }
.wn-dq-note{ margin:0; font-size:.78rem; color:var(--ink-soft,#3A362F); }
.wn-dq-error{ margin:0; font-size:.85rem; color:var(--dq-bad); font-weight:600; }

.wn-dq-mine{ background:var(--white,#fff); border:1px solid var(--line,#E7E0D2); border-radius:12px; padding:10px 12px; line-height:1.6; overflow-wrap:anywhere; }
.wn-dq-mine small{ display:block; font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-soft,#3A362F); margin-bottom:4px; }
.wn-dq-others{ display:flex; flex-direction:column; gap:10px; }
.wn-dq-others h4{ margin:0; font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-soft,#3A362F); }
.wn-dq-list{ display:flex; flex-direction:column; gap:12px; }
.wn-dq-ans{ display:flex; gap:10px; min-width:0; }
.wn-dq-ans.is-hidden{ opacity:.5; }
.wn-dq-av{ flex:none; width:30px; height:30px; border-radius:50%; object-fit:cover; background:var(--paper-deep,#F4EEE0); margin:0 !important; }
.wn-dq-ans-body{ min-width:0; flex:1; }
.wn-dq-name{ font-weight:700; font-size:.88rem; color:var(--ink,#120A08); text-decoration:none; }
.wn-dq-ans-text{ font-size:.97rem; line-height:1.6; overflow-wrap:anywhere; }
.wn-dq-ans-acts{ display:flex; align-items:center; gap:12px; margin-top:4px; font-size:.76rem; color:var(--ink-soft,#3A362F); }
.wn-dq-like, .wn-dq-hide, .wn-dq-more{ background:none; border:0; padding:0; font:inherit; color:inherit; cursor:pointer; display:inline-flex; align-items:center; gap:4px; font-weight:600; }
.wn-dq-like.liked{ color:var(--dq-bad); }
.wn-dq-like[disabled]{ cursor:default; opacity:.6; }
.wn-dq-hide{ color:var(--dq-bad); }
.wn-dq-more{ align-self:flex-start; color:var(--clay-deep,#C64F1E); font-size:.85rem; }
