
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Tahoma","Arial",sans-serif;background:#160b09;color:#fff5ec}
body{padding-bottom:88px;overflow-x:hidden}.sky{position:fixed;inset:0;z-index:-2;
background:
radial-gradient(circle at 14% 82%,rgba(255,180,64,.30) 0 3px,transparent 4px),
radial-gradient(circle at 88% 70%,rgba(255,95,32,.24) 0 2px,transparent 3px),
radial-gradient(ellipse at 50% 108%,rgba(255,78,22,.72) 0 9%,rgba(160,34,14,.55) 19%,transparent 42%),
radial-gradient(ellipse at 18% 102%,rgba(255,160,38,.55) 0 6%,rgba(139,38,18,.38) 16%,transparent 34%),
radial-gradient(ellipse at 82% 104%,rgba(255,118,24,.55) 0 7%,rgba(111,27,12,.40) 17%,transparent 36%),
linear-gradient(145deg,#24100d 0%,#3a1710 27%,#190e11 62%,#09080b 100%);
background-size:170px 170px,220px 220px,auto,auto,auto,auto}
header{height:68px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:#1a0c09e8;border-bottom:1px solid #ffffff18;position:sticky;top:0;z-index:20;backdrop-filter:blur(12px)}.brand{font-weight:900;font-size:clamp(18px,2.3vw,28px);color:#f6d477}.hud{display:flex;gap:12px}.hud span{background:#ffffff0d;border:1px solid #ffffff22;padding:8px 12px;border-radius:14px}.progress{height:5px;background:#ffffff10;position:sticky;top:68px;z-index:20}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#f1c85d,#f4775e);transition:.35s}
main{width:min(1180px,94vw);margin:28px auto}.screen{display:none;animation:enter .45s ease}.screen.active{display:block}@keyframes enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.panel{background:linear-gradient(145deg,#2a120ee8,#170d0ce8);border:1px solid #ffffff20;border-radius:28px;padding:clamp(20px,4vw,44px);box-shadow:0 24px 70px #0008;backdrop-filter:blur(12px);min-height:68vh}.hero,.finale{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.eyebrow{display:inline-block;color:#f6d477;font-weight:800;letter-spacing:.4px;margin-bottom:8px}.hero h1,.finale h1{font-size:clamp(44px,7vw,78px);margin:8px}.lead{font-size:clamp(20px,2.3vw,29px);line-height:1.9;max-width:900px}.mission,.note,.explain{padding:16px 20px;border-radius:18px;background:#ffffff0c;border:1px solid #ffffff18;line-height:1.9;font-size:20px;max-width:950px}.note{font-size:16px;color:#b9c7d8;margin-top:16px}.instruction{font-size:21px;line-height:1.8;color:#dce8f7}h2{font-size:clamp(29px,4vw,43px);margin:6px 0 12px}
.mapwrap{position:relative;width:min(100%,930px);margin:20px auto}.mapimg{display:block;width:100%;border-radius:20px;border:1px solid #ffffff22;background:white}.node{position:absolute;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;border:2px solid #ffe58b;background:#172d4d;color:#fff;font-size:22px;font-weight:900;cursor:pointer;box-shadow:0 0 0 8px #ffd75c20,0 0 28px #ffd75c}.node.activeNode{animation:pulse 1.2s infinite}.node.locked{opacity:.35;box-shadow:none;cursor:not-allowed}.node.done{opacity:.55;box-shadow:none}@keyframes pulse{50%{transform:translate(-50%,-50%) scale(1.22);box-shadow:0 0 0 15px #ffd75c12,0 0 38px #ffd75c}}
.explain{margin:16px auto;font-size:22px;font-weight:700}.lessons{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}.lessons div{padding:17px;border-radius:18px;background:#ffffff0c;border:1px solid #ffffff18;line-height:1.8;font-size:18px}
.trial{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:center}.sealbox{text-align:center}.seal{width:130px;height:130px;margin:auto;border-radius:50%;display:grid;place-items:center;border:3px solid #f6d477;color:#f6d477;font-size:58px;box-shadow:0 0 40px #f6d47733;transition:.4s}.seal.lit{box-shadow:0 0 65px #f6d477aa;transform:scale(1.08)}.flames{font-size:28px;letter-spacing:6px;margin:18px 0}.counter{color:#f6d477;font-weight:800}.caseq{font-size:25px;font-weight:900;line-height:1.7;margin-bottom:14px}.choice,.clue{display:block;width:100%;text-align:right;border:1px solid #ffffff22;background:#321712;color:#eef5ff;border-radius:15px;padding:14px 16px;margin:10px 0;font:inherit;font-size:19px;line-height:1.6;cursor:pointer;transition:.2s}.choice:hover,.clue:hover{transform:translateY(-2px);border-color:#f6d477}.good{background:#173c35!important;border-color:#64d8a2!important}.bad{background:#4b2025!important;border-color:#ff7b7b!important;animation:shake .28s}@keyframes shake{25%{transform:translateX(6px)}75%{transform:translateX(-6px)}}.hint{margin-top:12px;color:#b8c9df}
.orderlist{display:grid;gap:10px}.orderitem{display:flex;gap:10px;align-items:center;background:#ffffff0c;border:1px solid #ffffff18;border-radius:16px;padding:12px}.orderitem span{flex:1;font-size:20px}.move{border:0;border-radius:10px;background:#4b2519;color:#fff;padding:9px 13px;font-size:20px;cursor:pointer}.check{border:0;border-radius:15px;background:linear-gradient(135deg,#f6d477,#e99b45);color:#25180a;font-weight:900;font-size:19px;padding:13px 22px;margin-top:18px;cursor:pointer}
.qbox,.behavior,.vaultq{background:#ffffff09;border:1px solid #ffffff18;border-radius:18px;padding:18px;margin:14px 0}.qtitle{font-size:21px;font-weight:900;line-height:1.7}.twobtn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.twobtn button{padding:14px;border-radius:14px;border:1px solid #ffffff22;background:#3b1b13;color:#fff;font-size:18px;cursor:pointer}
.bank{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.chip{padding:10px 14px;border-radius:13px;background:#4a2318;border:1px solid #ffffff28;cursor:pointer;font-size:19px}.chip.selected{outline:3px solid #f6d477}.fillarea{font-size:22px;line-height:2.5}.blank{display:inline-block;min-width:110px;text-align:center;padding:0 8px;margin:0 4px;border-bottom:2px dashed #f6d477;color:#f6d477;cursor:pointer}.blank.ok{border-bottom-style:solid;color:#87e7bd}
.nav{position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;align-items:center;gap:14px;padding:13px 4vw;background:#170b09ef;border-top:1px solid #ffffff20;backdrop-filter:blur(12px)}.nav button{border:1px solid #ffffff25;background:#3b1b13;color:#fff;border-radius:14px;padding:11px 18px;font-size:18px;font-weight:800;cursor:pointer}.nav .prev{margin-left:auto}.nav .next{margin-right:auto}.nav button:disabled{opacity:.3;cursor:not-allowed}#pageNo{color:#9fb0c7;font-weight:700}
#toast{position:fixed;z-index:100;top:88px;left:50%;transform:translateX(-50%) translateY(-15px);opacity:0;pointer-events:none;background:#3a1711;border:1px solid #ffffff22;border-radius:14px;padding:12px 20px;font-weight:800;transition:.25s}#toast.show{opacity:1;transform:translateX(-50%)}
.result{font-size:24px;background:#ffffff0d;padding:18px 24px;border-radius:18px}.finalseal{margin-bottom:12px}
@media(max-width:760px){.trial{grid-template-columns:1fr}.panel{padding:18px}.node{width:44px;height:44px}.twobtn{grid-template-columns:1fr}.nav button{font-size:15px;padding:10px 12px}}

.lessons-lines{display:flex!important;flex-direction:column;gap:10px}
.lessons-lines div{
  position:relative;
  padding:15px 20px 15px 54px;
  border-radius:16px;
  background:linear-gradient(90deg,rgba(255,111,35,.12),rgba(255,209,105,.06));
  border:1px solid rgba(255,188,84,.22);
  line-height:1.9;
  font-size:19px;
  transform-origin:right center;
  animation:lessonGlow 3.8s ease-in-out infinite;
}
.lessons-lines div:nth-child(2n){animation-delay:.7s}
.lessons-lines div:nth-child(3n){animation-delay:1.4s}
.lessons-lines div::before{
  content:"✦";
  position:absolute;
  right:auto;
  left:20px;
  top:50%;
  transform:translateY(-50%);
  color:#ffc85b;
  text-shadow:0 0 14px #ff7b28;
}
@keyframes lessonGlow{
  0%,100%{transform:translateX(0);box-shadow:0 0 0 rgba(255,118,33,0)}
  50%{transform:translateX(-4px);box-shadow:0 0 24px rgba(255,102,28,.10)}
}
.verseflow{
  display:block;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(62,24,14,.55);
  border:1px solid rgba(255,184,83,.20);
  font-size:21px;
  line-height:2.35;
  text-align:right;
}
.versefrag{display:inline}
.fillarea{font-size:21px;line-height:2.35}
