/* ============================================================================
   ЗАДАНИЯ (09.10.2026, 53-я) — окно по его выбору В5 «Большой сундук слева» (client/maket-zadaniya.html):
   слева сундук с кольцом «N / 41» и наградой за все, справа три широкие строки заданий.
   Рисует js/32-zadaniya.js, правила — shared/quests.js, считает и выдаёт сервер (/api/quests).
   ========================================================================== */

.qw-modal{ width:min(640px,94%); height:min(334px,367px); padding:12px; display:flex; flex-direction:row; gap:12px; text-align:left; overflow:visible; }
.qw-modal .qw-x{ right:-10px; top:-10px; width:26px; height:26px; border-radius:50%; background:linear-gradient(180deg,#e04848,#9a1a1a); color:#fff;
  border:2px solid #ffd0b0; font-weight:800; font-size:14px; box-shadow:0 2px 8px rgba(0,0,0,.6); z-index:7; }

/* левая часть — большой сундук */
.qw-left{ width:196px; flex-shrink:0; border-radius:12px; border:1px solid #8a6a2a; display:flex; flex-direction:column; align-items:center; padding:10px; gap:6px; text-align:center;
  background:radial-gradient(ellipse at 50% 35%,rgba(255,203,61,.22),transparent 65%),linear-gradient(180deg,#2e2216,#120d09); }
.qw-cap{ font:900 13px 'Cinzel',serif; letter-spacing:.14em; color:var(--gold-bright); text-transform:uppercase; }
.qw-ring{ width:96px; height:96px; border-radius:50%; position:relative; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  background:conic-gradient(#ffd76a calc(var(--p) * 1%),#2a2016 0); box-shadow:0 0 18px rgba(255,203,61,.25); }
.qw-ring::before{ content:''; position:absolute; inset:7px; border-radius:50%; background:radial-gradient(circle at 50% 40%,#3a2a16,#140e08); }
.qw-ring .ch{ position:relative; line-height:0; }
.qw-ring b{ position:absolute; bottom:-8px; left:50%; transform:translateX(-50%); font:700 11px 'JetBrains Mono',monospace; color:#2a1410;
  background:linear-gradient(180deg,#f0d060,#caa44c); padding:1px 8px; border-radius:8px; white-space:nowrap; }
.qw-sub{ font:700 10px 'Inter',sans-serif; color:var(--muted); margin-top:6px; }
.qw-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 6px; width:100%; }
.qw-list .qw-rw{ font-size:10.5px; justify-content:center; padding:3px 0; border-radius:6px; background:rgba(0,0,0,.35); min-width:0; }
.qw-list .qw-rw .ic{ font-size:12px; }
.qw-final{ width:100%; margin-top:auto; }

/* правая часть — три строки */
.qw-right{ flex:1; min-width:0; display:flex; flex-direction:column; gap:7px; }
.qw-t{ font:900 14px 'Cinzel',serif; letter-spacing:.14em; color:var(--gold-bright); text-transform:uppercase; padding-right:20px; }
.qw-row{ flex:1; min-height:0; display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:10px; align-items:center; padding:7px 10px; border-radius:10px;
  background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.02)); border:1px solid #5a4630; }
.qw-row > .ic{ font-size:22px; width:40px; height:40px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.4); border:1px solid #4a3a28; }
.qw-row > .ic .qw-por{ display:flex; width:34px; height:34px; } .qw-row > .ic .qw-por svg{ width:100%; height:100%; }   /* «Найми …» — портрет героя */
.qw-mid{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.qw-tx{ font:700 12px/1.2 'Inter',sans-serif; color:var(--parchment); }
.qw-end{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; min-width:92px; }
.qw-row.ok{ border-color:#3fa860; background:linear-gradient(90deg,rgba(126,224,160,.18),rgba(126,224,160,.04)); }
.qw-empty{ flex:1; display:flex; align-items:center; justify-content:center; text-align:center; padding:10px; border-radius:10px; border:1px dashed #5a4630;
  font:700 13px/1.4 'Inter',sans-serif; color:var(--parchment); }
.qw-empty b{ color:var(--gold-bright); }

/* полоска, награда, кнопки */
.qw-bar{ position:relative; height:12px; border-radius:6px; background:#1a1208; border:1px solid #6a5028; overflow:hidden; }
.qw-bar i{ position:absolute; left:0; top:0; bottom:0; background:linear-gradient(180deg,#ffe07a,#c8912a); }
.qw-bar.g i{ background:linear-gradient(180deg,#9af0b0,#3fa860); }
.qw-bar b{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font:700 8.5px 'JetBrains Mono',monospace; color:#fff3c0; text-shadow:0 1px 2px #000; white-space:nowrap; }
.qw-rw{ display:inline-flex; align-items:center; gap:3px; font:700 11px 'JetBrains Mono',monospace; color:#fff; white-space:nowrap; }
.qw-rw .ic{ font-size:15px; }
.qw-rws{ display:flex; flex-wrap:wrap; justify-content:flex-end; gap:2px 6px; }
.qw-btn{ font:800 11.5px 'Cinzel',serif; border-radius:9px; padding:6px 12px; text-align:center; white-space:nowrap; cursor:pointer; }
.qw-btn.take{ color:#10260f; background:linear-gradient(180deg,#9af0b0,#3fa860); border:1px solid #c0ffd0; box-shadow:0 0 14px rgba(126,224,160,.6); animation:qwPulse 1.2s ease-in-out infinite; }
.qw-btn.off{ color:#9a8c74; background:rgba(0,0,0,.35); border:1px solid #4a3a28; cursor:default; }
.qw-btn.busy{ opacity:.6; pointer-events:none; }
@keyframes qwPulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.04); } }

/* кнопка «Задания»: красная точка — есть что забрать (его ответ 3А); после большой награды кнопки нет (4) */
.quest-btn .drawer-dot{ top:-2px; right:-2px; }
.quest-btn.gone{ display:none; }

/* 71-я, его выбор фона 1 «Зал писцов» (ui-proba/zadaniya/fon-a.jpg): фон на всё окно; панель сундука и строки — полупрозрачные, чтобы зал было видно */
.qw-modal{ background:#140e08 url(img/zadaniya/fon.webp) center/cover no-repeat; }
.qw-left{ background:radial-gradient(ellipse at 50% 35%,rgba(255,203,61,.18),transparent 65%),rgba(18,12,7,.55); }
.qw-row{ background:linear-gradient(90deg,rgba(20,14,8,.62),rgba(20,14,8,.42)); }
.qw-row.ok{ background:linear-gradient(90deg,rgba(40,90,55,.55),rgba(20,14,8,.45)); }

/* 71-я, его листы Gemini под «Зал писцов» (ui-proba/zadaniya/list-1…4.jpg, нарезка kuski/): сундук, плашки строк, полоска, кнопки, значки */
.qw-row{ border:none; background:url(img/zadaniya/stroka.webp) center/100% 100% no-repeat; grid-template-columns:62px minmax(0,1fr) auto; padding:6px 14px 6px calc(11.9% - 31px); }   /* центр гнезда на плашке — 11,9 % ширины (замер по stroka.png: гнездо x 68–296 из 1530), значок — ровно в его центр */
.qw-row.ok{ border:none; background:url(img/zadaniya/stroka-ok.webp) center/101.8% 110% no-repeat; }
.qw-row > .ic{ width:62px; height:60px; border:none; background:none; border-radius:0; }   /* гнездо на самой плашке */
.qw-row > .ic .qw-ik{ width:46px; height:46px; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.qw-row > .ic .qw-por{ width:46px; height:46px; }
.qw-bar{ height:13px; border:none; border-radius:0; background:url(img/zadaniya/polosa.webp) center/100% 100% no-repeat; overflow:visible; }
.qw-bar i, .qw-bar.g i{ left:2px; top:3px; bottom:3px; max-width:calc(100% - 4px); background:url(img/zadaniya/polosa-zal.webp) right center/100% 100% no-repeat; }
.qw-btn.take, .qw-btn.off{ min-width:86px; height:31px; padding:0 14px; display:flex; align-items:center; justify-content:center; border:none; border-radius:0; box-shadow:none; }
.qw-btn.take{ color:#f2fff4; text-shadow:0 1px 2px #062010,0 0 4px #062010; background:url(img/zadaniya/kn-zabrat.webp) center/100% 100% no-repeat; }
.qw-btn.off{ color:#d8c6a2; text-shadow:0 1px 2px #000; background:url(img/zadaniya/kn-off.webp) center/100% 100% no-repeat; }
.qw-btn.take.qw-final{ height:52px; padding-top:12px; color:#3a2008; text-shadow:0 1px 0 rgba(255,240,190,.6); background:url(img/zadaniya/kn-vse.webp) center/100% 100% no-repeat; }
.qw-ring .ch .qw-chest{ width:66px; height:auto; display:block; filter:drop-shadow(0 3px 4px rgba(0,0,0,.6)); }