.hero-tree-summary{display:flex;flex-wrap:wrap;gap:12px 24px;padding:16px 18px;margin-bottom:20px;background:linear-gradient(110deg,#273d30,#12261f);border:1px solid #71805c}.hero-tree-summary>span{flex:1;min-width:120px;color:#b8c4b0;font-size:12px}.hero-tree-summary strong{display:block;font:24px Georgia;color:#eddaa3;margin:4px 0}.hero-tree-summary small{font-size:10px;color:#b2baa4}.tree-skills{margin:18px 0 26px}.tree-skills h2{font-size:16px;color:#ead8a2;margin:0 0 14px}.tree-skills h2 small{font-size:11px;font-weight:400;color:#a7b79e;margin-left:8px}.skill-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;--tree-color:#d8bd78}.skill-mini{border:0;background:transparent;color:#ead8aa;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:6px 0}.skill-mini strong{font-size:12px;font-weight:500}.skill-mini small{font:11px Georgia;color:#b9c5af}.tree-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:0 0 0}.tree-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:51px;padding:8px 4px;border:1px solid #57664e;background:#14251d;color:var(--tree-color);font:13px Georgia,'Noto Serif TC',serif;cursor:pointer;border-radius:3px 3px 0 0}.tree-tabs svg{width:22px;height:22px}.tree-tabs [aria-selected=true]{border-color:var(--tree-color);border-bottom:2px solid var(--tree-color);background:linear-gradient(#30463c,#162c24);box-shadow:inset 0 2px 0 var(--tree-color)}.tree-panel{background:radial-gradient(ellipse at 50% 75%,#24443a80,transparent 70%),linear-gradient(#14291f,#0c1c17);border:1px solid #64745a;padding:18px 12px 14px;position:relative;overflow:hidden}.tree-panel-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:0 6px 16px;border-bottom:1px solid #56664a70}.tree-panel-top h2{font-size:21px;color:var(--tree-color);margin:0 0 6px}.tree-panel-top p{font-size:12px;line-height:1.7;color:#b7c6ad;margin:0}.tree-chip{border:1px solid var(--tree-color);color:var(--tree-color);padding:4px 7px;font-size:11px;white-space:nowrap;border-radius:2px}.tree-graph{position:relative;margin-top:8px;width:100%;background:repeating-linear-gradient(0deg,transparent,transparent 114px,#64745a18 115px,#64745a18 116px)}.tree-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.tree-lines path{fill:none;stroke:#69746c;stroke-width:2;vector-effect:non-scaling-stroke;opacity:.55}.tree-lines path.lit{stroke:var(--tree-color);opacity:1;filter:drop-shadow(0 0 3px var(--tree-color))}.tree-node{position:absolute;width:calc(100% / var(--tree-cols));max-width:140px;transform:translateX(-50%);border:0;background:transparent;padding:0 2px;color:#d9e2cd;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:1;min-height:100px}.tree-node strong{font-size:12px;line-height:1.4;font-weight:500;max-width:100%;white-space:normal;overflow-wrap:anywhere}.tree-node small{font-size:10px;line-height:1.3;color:#a5b69f}.tree-medallion{width:58px;height:58px;box-sizing:border-box;position:relative;display:grid;place-items:center;border:2px solid #78887e;border-radius:50%;color:#cad7c9;background:radial-gradient(circle at 40% 25%,#43504d,#182824 75%);box-shadow:inset 0 0 0 3px #0d1d18,0 3px 5px #0008;flex:none}.tree-medallion>svg{width:31px;height:31px}.tree-rank{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);font:10px Georgia;background:#12231c;border:1px solid #839478;color:#e8dec2;border-radius:8px;padding:1px 5px;white-space:nowrap}.tree-node.complete .tree-medallion,.tree-node.invested .tree-medallion,.skill-mini.invested .tree-medallion{border-color:var(--tree-color);color:#f3f3d9;box-shadow:inset 0 0 0 3px #16291f,0 0 9px color-mix(in srgb,var(--tree-color) 25%,transparent)}.tree-node.complete .tree-rank{color:var(--tree-color);border-color:var(--tree-color)}.tree-node.ready .tree-medallion{border-color:var(--tree-color);color:var(--tree-color);box-shadow:inset 0 0 0 3px #16291f,0 0 13px color-mix(in srgb,var(--tree-color) 40%,transparent)}.tree-plus{position:absolute;right:-5px;top:-5px;border-radius:50%;background:var(--tree-color);color:#102219;border:2px solid #12251d;font:13px Georgia;padding:1px 3px}.tree-node.locked .tree-medallion,.skill-mini.locked .tree-medallion{filter:grayscale(1);opacity:.53}.tree-node.locked strong,.skill-mini.locked strong{color:#9caa9b}.tree-node.working .tree-medallion{border-color:var(--tree-color);border-top-color:#f4e4ac;animation:tree-breathe 1.8s ease-in-out infinite}.tree-node:hover .tree-medallion,.skill-mini:hover .tree-medallion{filter:brightness(1.2);opacity:1}.tree-node:focus-visible,.skill-mini:focus-visible,.tree-tabs button:focus-visible{outline:2px solid #f3d996;outline-offset:3px;border-radius:5px}.tree-help{color:#a5b79f;font-size:11px;line-height:1.7;margin:8px 5px}.tree-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0;color:#afbea5;font-size:12px}.tree-detail-icon{--tree-color:#d8bd78;width:72px;height:72px;display:grid;place-items:center;border:2px solid var(--tree-color);color:var(--tree-color);border-radius:50%;background:radial-gradient(#3b5240,#132a20);margin:12px auto 22px;box-shadow:0 0 16px #7aab8133}.tree-detail-icon svg{width:40px;height:40px}@keyframes tree-breathe{50%{box-shadow:0 0 16px var(--tree-color)}}@media(max-width:600px){.hero-tree-summary{padding:12px;gap:12px}.hero-tree-summary>span{min-width:80px;font-size:10px}.hero-tree-summary strong{font-size:21px}.tree-panel{padding:14px 7px}.tree-tabs button{font-size:12px;gap:5px;min-height:47px}.tree-tabs svg{width:19px;height:19px}.tree-medallion{width:51px;height:51px}.tree-medallion>svg{width:27px;height:27px}.tree-node strong{font-size:10px}.tree-node small{font-size:9px}.tree-footer{font-size:11px}.skill-mini strong{font-size:11px}.tree-panel-top h2{font-size:18px}}@media(prefers-reduced-motion:reduce){.tree-node.working .tree-medallion{animation:none}}
