/* ===== GREENFALL — panel design system ===== */
#panel{padding:0;border-radius:16px;overflow:auto;background:linear-gradient(180deg,rgba(11,28,26,.97),rgba(4,10,10,.985));border:1px solid #1f7a5f;
  box-shadow:0 0 0 1px rgba(0,0,0,.8),0 30px 80px rgba(0,0,0,.85),0 0 60px rgba(55,242,160,.14);width:min(900px,96vw);max-height:90vh}
#panel.wide{width:min(1200px,97vw)}
#panel::-webkit-scrollbar{width:8px}#panel::-webkit-scrollbar-thumb{background:#1f6f58;border-radius:4px}
#panel .close{position:absolute;right:14px;top:12px;z-index:5;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);border:1px solid #2a5a4b;font-size:14px;color:#9fd8c4;cursor:pointer}
#panel .close:hover{background:#7a1a2a;color:#fff;border-color:#ff5a72}
.pn-head{position:relative;display:flex;gap:16px;align-items:center;padding:20px 64px 16px 26px;border-bottom:1px solid rgba(55,242,160,.2);background:linear-gradient(90deg,rgba(55,242,160,.11),rgba(55,242,160,0) 70%)}
.pn-head::after{content:"";position:absolute;left:0;bottom:-1px;width:120px;height:2px;background:linear-gradient(90deg,#37f2a0,transparent)}
.pn-ico{width:62px;height:62px;border-radius:14px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:32px;background:radial-gradient(circle at 30% 25%,#1d5a48,#07201b);border:1px solid #2fbf8a;box-shadow:0 0 22px rgba(55,242,160,.35),inset 0 0 14px rgba(0,0,0,.6)}
.pn-ico img{width:100%;height:100%;border-radius:13px;object-fit:cover}
.pn-title h2{margin:0;font-size:20px;letter-spacing:.18em;color:#eafff6;text-shadow:0 0 14px rgba(55,242,160,.5)}
.pn-title .sub{margin-top:3px;color:#7fb5a2;font-size:12px;letter-spacing:.06em}
.pn-res{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:360px}
.pn-body{position:relative;padding:18px 26px 24px}
.pn-sec{margin:18px 0 8px;font-size:11px;letter-spacing:.24em;color:#5fd6a4;display:flex;align-items:center;gap:10px}
.pn-sec::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(95,214,164,.5),transparent)}
.pn-foot{margin-top:16px;color:#5d8878;font-size:11px;letter-spacing:.04em;line-height:1.6}

.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:14px;background:rgba(0,0,0,.5);border:1px solid #1d5a49;font-size:11px;color:#bfeadb;white-space:nowrap}
.chip b{color:#fff}.chip.no{border-color:#8a2a3a;color:#ff9aa8;background:rgba(80,10,20,.35)}.chip.ok{border-color:#2fbf8a}
.chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.keycap{display:inline-block;min-width:26px;text-align:center;padding:2px 8px;border:1px solid #4a9a84;border-bottom-width:3px;border-radius:6px;background:linear-gradient(#143a32,#0b211d);font-weight:800;font-size:11px;color:#dffff3}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.grid.g3{grid-template-columns:repeat(3,1fr)}.grid.g2{grid-template-columns:repeat(2,1fr)}
.card{position:relative;border:1px solid #1d5a49;border-radius:12px;padding:14px;background:linear-gradient(160deg,rgba(16,44,40,.85),rgba(6,16,16,.9));transition:.15s;overflow:hidden}
.card:hover{border-color:#37f2a0;box-shadow:0 0 22px rgba(55,242,160,.2);transform:translateY(-1px)}
.card::before{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,rgba(55,242,160,.14),transparent 70%)}
.card.locked{opacity:.55;filter:grayscale(.7)}.card.owned{border-color:#2f8a6f}
.card .top{display:flex;gap:12px;align-items:center}
.card .ic{width:58px;height:58px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:30px;background:radial-gradient(circle at 30% 25%,#1d4a3f,#06181a);border:1px solid #2a8a6f;overflow:hidden}
.card .ic img{width:100%;height:100%;object-fit:contain}
.card h4{margin:0;font-size:14px;color:#fff;letter-spacing:.04em}.card .sub{font-size:11px;color:#86b8a6;margin-top:2px;line-height:1.4}
.card .act{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.card .act button{margin-left:auto}
.stat{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.1em;color:#7fb5a2;margin-top:5px}
.stat span{width:44px}.stat i{flex:1;height:6px;background:#0d2723;border-radius:3px;overflow:hidden;border:1px solid #14403a}
.stat i b{display:block;height:100%;background:linear-gradient(90deg,#1aa56f,#9dffd0);box-shadow:0 0 8px rgba(55,242,160,.6)}
.stat.r i b{background:linear-gradient(90deg,#a1001a,#ff5a72)}.stat.a i b{background:linear-gradient(90deg,#b8800a,#ffd27a)}
.pips{display:inline-flex;gap:3px;margin-left:8px;vertical-align:middle}.pip{width:14px;height:8px;border-radius:2px;background:#10302a;border:1px solid #2a6f58}.pip.on{background:linear-gradient(#7dffc0,#1aa56f);box-shadow:0 0 6px rgba(55,242,160,.7)}
button.big{padding:11px 22px;font-size:13px;letter-spacing:.14em;border-radius:8px}
button.ghost{background:transparent;border:1px solid #2a6f58;color:#9fd8c4}
.tilebtn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px;border-radius:12px;border:1px solid #1d5a49;background:linear-gradient(160deg,rgba(16,44,40,.85),rgba(6,16,16,.9));cursor:pointer;color:#dffff3;font-weight:700;letter-spacing:.08em;font-size:12px;transition:.15s}
.tilebtn:hover:not(.dis){border-color:#37f2a0;box-shadow:0 0 22px rgba(55,242,160,.25);transform:translateY(-2px)}
.tilebtn .t-ic{font-size:34px}.tilebtn small{font-weight:400;color:#86b8a6;letter-spacing:0;text-align:center;font-size:11px}.tilebtn.dis{opacity:.4;cursor:not-allowed}

/* ---- rig bench ---- */
.rig-wrap{display:grid;grid-template-columns:1fr 330px;gap:18px}
.rig-stage{position:relative;height:520px;border-radius:14px;overflow:hidden;border:1px solid #1d5a49;background:radial-gradient(ellipse at 50% 70%,#0f3a33 0%,#07181a 55%,#030909 100%)}
.rig-stage::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(55,242,160,.035) 0 1px,transparent 1px 4px);pointer-events:none}
.rig-stage canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab}
.rig-stage canvas:active{cursor:grabbing}
#rigLines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rig-col{position:absolute;top:12px;bottom:12px;display:flex;flex-direction:column;justify-content:space-around;gap:10px;width:228px}
.rig-col.l{left:12px}.rig-col.r{right:12px}
.rig-card{position:relative;border:1px solid var(--ac);border-radius:10px;padding:9px 11px;background:linear-gradient(160deg,rgba(7,22,22,.92),rgba(3,10,10,.92));backdrop-filter:blur(2px);box-shadow:0 0 14px color-mix(in srgb,var(--ac) 25%,transparent);transition:.15s}
.rig-card:hover,.rig-card.hi{box-shadow:0 0 26px color-mix(in srgb,var(--ac) 55%,transparent);transform:scale(1.03);z-index:3}
.rig-card .rh{display:flex;align-items:center;gap:8px;font-weight:800;letter-spacing:.08em;font-size:12px;color:var(--ac)}
.rig-card .rh .em{font-size:20px}
.rig-card .rv{font-size:11px;color:#bfeadb;margin:5px 0 3px}.rig-card .rv b{color:#fff}.rig-card .rv i{color:var(--ac);font-style:normal}
.rig-card .rd{font-size:10px;color:#6fa593;line-height:1.35}
.rig-card button{margin-top:6px;width:100%;padding:5px 8px;font-size:11px}
.rig-card .max{margin-top:6px;text-align:center;font-size:11px;letter-spacing:.2em;color:var(--ac)}
.rig-card .pips{margin-left:auto;gap:2px}.rig-card .pip{width:9px;height:7px}
.rig-card .pips .pip.on{background:var(--ac);box-shadow:0 0 6px var(--ac)}
.rig-side{display:flex;flex-direction:column;gap:12px}
.bigstats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bs{border:1px solid #1d5a49;border-radius:10px;padding:10px 12px;background:rgba(0,0,0,.35)}
.bs small{display:block;font-size:10px;letter-spacing:.16em;color:#6fa593}.bs b{font-size:22px;color:#74e8ff;text-shadow:0 0 12px rgba(116,232,255,.5)}
.reach{display:flex;flex-direction:column;gap:5px}
.reach .rr{display:flex;align-items:center;gap:8px;font-size:12px;padding:5px 9px;border-radius:8px;background:rgba(0,0,0,.3);border:1px solid #143a32}
.reach .rr.lock{opacity:.5}.reach .rr.lock .hz{color:#ff7a8c;border-color:#7a2a38}
.reach .hz{margin-left:auto;font-size:10px;padding:1px 7px;border-radius:9px;border:1px solid #2a8a6f;color:#7dffc0;letter-spacing:.1em}
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:30px;height:30px;border-radius:50%;border:2px solid #0b2a24;cursor:pointer;box-shadow:0 0 0 1px #2a6f58;position:relative}
.sw.sel{box-shadow:0 0 0 2px #fff,0 0 14px currentColor}.sw.lockd{opacity:.35;cursor:not-allowed}.sw.lockd::after{content:"🔒";position:absolute;inset:0;font-size:12px;display:flex;align-items:center;justify-content:center}

/* ---- dialogue ---- */
.dlg2{display:grid;grid-template-columns:210px 1fr;gap:22px}
.portrait{position:relative;border-radius:14px;overflow:hidden;border:1px solid #2fbf8a;background:radial-gradient(circle at 50% 30%,#1f5a4a,#061816 75%);box-shadow:0 0 28px rgba(55,242,160,.22);height:250px}
.portrait img{position:absolute;inset:-4px 0 0 0;width:100%;height:100%;object-fit:cover}
.portrait .plate{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;background:linear-gradient(0deg,rgba(0,0,0,.85),transparent);font-size:11px;letter-spacing:.12em;color:#7dffc0;text-align:center}
.speech{position:relative;border:1px solid #1d5a49;border-radius:14px;padding:16px 18px;background:rgba(0,0,0,.32);line-height:1.7;font-size:14px;min-height:140px}
.speech::before{content:"❝";position:absolute;left:12px;top:-6px;font-size:30px;color:#2fbf8a}
.speech p{margin:0 0 10px;animation:fup .45s both}.speech p:nth-child(2){animation-delay:.12s}.speech p:nth-child(3){animation-delay:.24s}
@keyframes fup{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.qcard{margin-top:12px;border:1px dashed #d9a93a;border-radius:12px;padding:12px 14px;background:linear-gradient(160deg,rgba(60,44,8,.35),rgba(10,10,6,.35))}
.qcard h5{margin:0;font-size:11px;letter-spacing:.2em;color:#ffd24d}.qcard b{display:block;margin:4px 0;font-size:15px;color:#fff}
.topics{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.topic{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid #1d5a49;border-radius:9px;background:rgba(0,0,0,.28);cursor:pointer;font-size:13px;color:#cfeee2;transition:.12s}
.topic:hover{border-color:#37f2a0;background:rgba(55,242,160,.1);padding-left:16px}
.topic .tk{color:#37f2a0}.topic.lock{opacity:.4;cursor:default}
.btnrow{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}

/* ---- hearth / clearance ---- */
.fire{position:relative;height:150px;border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 50% 100%,#5a2a0a 0%,#1a0f08 45%,#050a0a 100%);border:1px solid #6a3a1a;display:flex;align-items:flex-end;justify-content:center}
.flame{position:absolute;bottom:18px;width:46px;height:78px;border-radius:50% 50% 50% 50%/70% 70% 30% 30%;background:radial-gradient(ellipse at 50% 80%,#fff2b0,#ffb33a 45%,#ff5a1a 75%,transparent 80%);filter:blur(1px);transform-origin:50% 100%;animation:fl 1.1s infinite ease-in-out}
.flame.f2{left:calc(50% - 44px);width:32px;height:54px;animation-delay:-.4s}.flame.f3{left:calc(50% + 14px);width:28px;height:46px;animation-delay:-.7s}.flame.f1{left:calc(50% - 23px)}
@keyframes fl{0%,100%{transform:scale(1,1) skewX(0)}30%{transform:scale(.9,1.12) skewX(4deg)}60%{transform:scale(1.05,.94) skewX(-4deg)}}
.logs{position:absolute;bottom:10px;left:50%;margin-left:-60px;width:120px;height:18px;background:linear-gradient(90deg,#3a2514,#5a3a1f,#3a2514);border-radius:9px}
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}
.tier{border:1px solid #1d4a3f;border-radius:10px;padding:10px;text-align:center;background:rgba(0,0,0,.3);font-size:11px;color:#86b8a6}
.tier .ti{font-size:28px;display:block}.tier b{display:block;color:#dffff3;letter-spacing:.1em;margin-top:3px}
.tier.cur{border-color:#ffd24d;background:rgba(80,60,10,.35);box-shadow:0 0 18px rgba(255,210,77,.25)}.tier.done{border-color:#2fbf8a;color:#9dffd0}
.meter{height:10px;border-radius:5px;background:#0d2723;border:1px solid #1d5a49;overflow:hidden;margin:6px 0}.meter i{display:block;height:100%;background:linear-gradient(90deg,#b8800a,#ffd27a);box-shadow:0 0 10px rgba(255,210,77,.5)}
.unl{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.unl .chip{font-size:11px}

/* ---- journal ---- */
.jr{display:grid;grid-template-columns:150px 1fr;gap:18px;min-height:420px}
.jtabs{display:flex;flex-direction:column;gap:6px}
.jtab{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #1d4a3f;border-radius:10px;cursor:pointer;font-size:12px;letter-spacing:.12em;color:#9fd8c4;background:rgba(0,0,0,.25)}
.jtab:hover{border-color:#37f2a0}.jtab.sel{background:rgba(55,242,160,.14);border-color:#37f2a0;color:#fff}.jtab span{font-size:18px}
.beaconcard{display:flex;gap:16px;align-items:center;padding:14px 18px;border-radius:14px;border:1px solid #2fbf8a;background:linear-gradient(120deg,rgba(55,242,160,.14),rgba(0,0,0,.2))}
.beaconcard .bi{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:30px;background:radial-gradient(circle,#4dffa0 0,#0a4a30 70%);box-shadow:0 0 30px #37f2a0;animation:pulse 2s infinite}
.acts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.actbox{border:1px solid #1d4a3f;border-radius:10px;padding:10px 12px;font-size:12px;color:#86b8a6;background:rgba(0,0,0,.28)}.actbox b{display:block;color:#fff;letter-spacing:.1em}.actbox.on{border-color:#ffd24d;background:rgba(70,52,8,.3)}.actbox.lk{opacity:.5}
.qrow{display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid #1d4a3f;border-radius:10px;margin:6px 0;background:rgba(0,0,0,.28)}
.qrow img,.qface{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid #2fbf8a;background:#07201b;flex-shrink:0}
.qrow.rdy{border-color:#7dffb0;background:rgba(20,70,40,.25)}
.paper{position:relative;padding:14px 18px;margin:8px 0;border-radius:4px;background:linear-gradient(#e9dfbf,#d8cca4);color:#3a2f1e;box-shadow:0 6px 14px rgba(0,0,0,.5);transform:rotate(-.4deg)}
.paper:nth-child(even){transform:rotate(.5deg)}.paper h4{margin:0 0 4px;font-size:12px;letter-spacing:.12em;color:#7a3a1a}.paper p{margin:0;font-size:13px;line-height:1.55;font-style:italic;color:#3a2f1e}.paper small{display:block;margin-top:6px;color:#8a7a5a}
.term{background:#020a08;border:1px solid #2fbf8a;border-radius:8px;padding:16px 18px;font-family:Consolas,monospace;color:#6dffc0;line-height:1.7;box-shadow:inset 0 0 40px rgba(55,242,160,.12);position:relative;overflow:hidden}
.term::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px);pointer-events:none}
.term b{color:#fff}.term .warn{color:#ffd24d}

/* ---- HUD additions ---- */
#secBox{margin-top:4px;background:var(--panel);border:1px solid var(--edge);padding:6px 12px;border-radius:4px;text-align:right}
#secBox.ready{border-color:#ffd24d;box-shadow:0 0 16px rgba(255,210,77,.4);animation:pulse2 1.4s infinite}
@keyframes pulse2{50%{box-shadow:0 0 4px rgba(255,210,77,.1)}}
#secName{display:block;font-size:12px;letter-spacing:.14em;color:#ffe6a8}.secbar{height:5px;background:#0d2723;border-radius:3px;margin:4px 0;overflow:hidden}.secbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b8800a,#ffd27a);transition:width .3s}
#secTxt{font-size:10px;color:var(--dim)}
#quest .q{display:flex;gap:9px;align-items:center;margin-bottom:8px}#quest .q b{color:#fff}#quest .q em{color:#ffd24d;font-style:normal}
#quest .q.rdy b{color:#7dffb0}#quest .q.offer b{color:#ffd24d}#quest .qface{width:30px;height:30px}
#buildbar{flex-direction:column;gap:6px;padding:8px 10px 10px}
#buildbar .bhead{display:flex;gap:14px;align-items:center;font-size:11px;letter-spacing:.14em;color:#ffe6a8;padding:0 4px 2px}#buildbar .bhead em{font-style:normal;color:#86b8a6;letter-spacing:.04em;margin-left:auto}#buildbar .bhead em+em{margin-left:0}
#buildbar .brow{display:grid;grid-template-columns:repeat(6,88px);gap:6px}
.bitem{position:relative}.bitem .bk{position:absolute;left:5px;top:3px;font-size:9px;color:#5d8878}.bitem.lock{opacity:.5;border-style:dashed}.bitem.lock small{color:#ffb347}

/* ---- building catalogue drawer ---- */
#buildbar{max-width:min(760px,calc(100vw - 470px));left:calc(50% - 100px);bottom:96px}
#buildbar .bhead{display:flex;gap:14px;align-items:center;font-size:11px;letter-spacing:.14em;color:#ffe6a8;padding:0 4px 2px}
#buildbar .bhead em{font-style:normal;color:#86b8a6;letter-spacing:.04em}#buildbar .bhead .hintk{margin-left:auto;color:#5d8878;font-size:10px}
.btabs{display:flex;gap:5px;flex-wrap:wrap}
.btab{display:flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid #1d4a3f;border-radius:7px;font-size:10px;letter-spacing:.12em;cursor:pointer;color:#9fd8c4;background:rgba(0,0,0,.3)}
.btab:hover{border-color:#37f2a0}.btab.sel{background:rgba(55,242,160,.16);border-color:#37f2a0;color:#fff}.btab span{font-size:14px}.btab em{font-style:normal;color:#5d8878;font-size:9px;margin-left:2px}
#buildbar .brow{display:flex;flex-wrap:wrap;gap:6px;max-height:190px;overflow-y:auto}
#buildbar .bitem{width:84px;min-height:78px;padding:6px 3px}#buildbar .bitem b{font-size:21px}#buildbar .bitem small{font-size:9px;line-height:1.3}
/* ---- market & gunsmith ---- */
.repbox{margin-top:10px;display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--fc,#2fbf8a);border-radius:12px;background:rgba(0,0,0,.35)}
.repbox .rb-ic{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(0,0,0,.5);border:1px solid var(--fc,#2fbf8a);flex-shrink:0}
.repbox b{display:block;font-size:12px;letter-spacing:.08em;color:var(--fc,#fff)}
.repbox small{display:block;font-size:10px;color:#86b8a6;line-height:1.35;margin:2px 0 5px}
.repbox em{font-style:normal;font-size:10px;letter-spacing:.16em;color:#ffd24d;margin-left:8px}
.repbox .pips{margin-left:0}
.mtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.mtab{display:flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid #1d4a3f;border-radius:10px;cursor:pointer;font-size:12px;letter-spacing:.14em;color:#9fd8c4;background:rgba(0,0,0,.25)}
.mtab:hover{border-color:#37f2a0}.mtab.sel{background:rgba(55,242,160,.14);border-color:#37f2a0;color:#fff}.mtab span{font-size:17px}
.paper .sketch{display:block;width:100%;max-width:420px;margin:0 auto 10px;border-radius:3px;box-shadow:0 3px 10px rgba(0,0,0,.45);transform:rotate(-.6deg)}
.lorepaper p{font-size:15px;line-height:1.65}
.rl{display:flex;gap:8px;align-items:center;margin:3px 0;color:#cfeee2}.rl.dim{opacity:.55}.rl span{font-size:14px}

/* ---- skills & growth ---- */
.bar.xp{height:11px}.bar.xp i{background:linear-gradient(#ffe07a,#b8800a)}.bar.xp span{font-size:9px;top:-2px;letter-spacing:.1em}.bar.xp.pts{box-shadow:0 0 12px rgba(255,210,77,.7);animation:xpp 1.2s infinite alternate}
@keyframes xpp{to{box-shadow:0 0 20px rgba(255,210,77,1)}}
.mtab .cnt{font-style:normal;font-size:10px;background:rgba(55,242,160,.2);border-radius:9px;padding:1px 7px;margin-left:4px;color:#9dffd0}
.xphead{display:flex;gap:18px;align-items:center;margin:4px 0 14px;padding:12px 16px;border:1px solid #1d5a49;border-radius:12px;background:linear-gradient(120deg,rgba(55,242,160,.1),rgba(0,0,0,.25))}
.xphead .lvl,.xphead .pts{text-align:center;min-width:64px}.xphead small{display:block;font-size:9px;letter-spacing:.2em;color:#86b8a6}.xphead b{font-size:30px;color:#fff;line-height:1}.xphead .pts b{color:#6a8a80}.xphead .pts.on b{color:#ffd24d;text-shadow:0 0 14px rgba(255,210,77,.8)}
.xpbar{height:10px;border-radius:5px;background:#0d2723;border:1px solid #1d5a49;overflow:hidden;margin-bottom:4px}.xpbar i{display:block;height:100%;background:linear-gradient(90deg,#b8800a,#ffd27a);box-shadow:0 0 10px rgba(255,210,77,.5)}
.sk-tree{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;align-items:start}
.sk-col{display:flex;flex-direction:column;gap:0}
.node{position:relative;display:flex;gap:12px;align-items:center;padding:11px 12px;border:1px solid #1d5a49;border-radius:13px;background:linear-gradient(160deg,rgba(16,44,40,.85),rgba(6,16,16,.92));margin-bottom:12px;transition:transform .15s,box-shadow .15s,border-color .15s;margin-left:calc(var(--d) * 22px)}
.node:hover{transform:translateX(4px) scale(1.02);border-color:#37f2a0;box-shadow:0 0 22px rgba(55,242,160,.25)}
.node .link{position:absolute;left:-14px;top:-14px;width:12px;height:36px;border-left:2px solid #2a8a6f;border-bottom:2px solid #2a8a6f;border-radius:0 0 0 8px}
.node .ni{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;background:radial-gradient(circle at 30% 25%,#1d4a3f,#06181a);border:2px solid #2a6f58;transition:transform .2s}
.node:hover .ni{transform:rotate(-8deg) scale(1.12)}
.node.on .ni{border-color:#37f2a0;box-shadow:0 0 14px rgba(55,242,160,.5)}.node.max .ni{border-color:#ffd24d;box-shadow:0 0 16px rgba(255,210,77,.6)}
.node.lk{opacity:.5;filter:grayscale(.6)}
.node .nt{flex:1;min-width:0}.node .nt b{display:block;font-size:13px;color:#fff;letter-spacing:.04em}.node .nt small{display:block;font-size:10.5px;color:#86b8a6;margin:2px 0 4px;line-height:1.35}.node .nt .pips{margin-left:0}
.node button{width:34px;height:34px;border-radius:50%;padding:0;font-size:20px;line-height:1;flex-shrink:0}
.vneeds{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:9px}
.vneed{position:relative;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto auto;gap:0 9px;padding:9px 11px;border:1px solid #1d4a3f;border-radius:11px;background:rgba(0,0,0,.28);transition:.15s}
.vneed:hover{border-color:#37f2a0;transform:translateY(-1px)}.vneed .vi{grid-row:1/4;font-size:24px;align-self:center;text-align:center}
.vneed b{font-size:12px;color:#fff;letter-spacing:.08em}.vneed small{font-size:10px;color:#86b8a6;line-height:1.3}.vneed i{display:block;height:6px;border-radius:3px;background:#0d2723;border:1px solid #14403a;overflow:hidden;margin:3px 0 4px}
.vneed i u{display:block;height:100%;background:linear-gradient(90deg,#1aa56f,#9dffd0);text-decoration:none}.vneed.ok{border-color:#2fbf8a;background:rgba(20,70,50,.28)}.vneed.ok i u{background:linear-gradient(90deg,#b8800a,#ffd27a)}