.skill-tree-page{height:calc(100vh - var(--header-height) - 48px);-webkit-user-select:none;user-select:none;flex-direction:column;max-width:none;padding:0;display:flex;position:relative;overflow:hidden}.skill-tree-controls{background:var(--bg-secondary);border-bottom:1px solid var(--border-default);z-index:10;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.controls-left{align-items:center;gap:24px;display:flex}.controls-right{align-items:center;gap:12px;display:flex}.points-display{align-items:center;gap:16px;display:flex}.points-total{flex-direction:column;align-items:flex-start;display:flex}.points-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);font-size:11px;font-weight:600}.points-value{color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:24px;font-weight:700}.points-value .points-max{color:var(--text-muted);font-weight:400}.bonus-points-control{border-left:1px solid var(--border-default);flex-direction:column;align-items:flex-start;gap:4px;padding-left:16px;display:flex}.bonus-points-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);font-size:11px;font-weight:600}.bonus-points-stepper{align-items:center;gap:8px;display:flex}.bonus-stepper-btn{background:var(--bg-tertiary);border:1px solid var(--border-default);border-radius:var(--radius-sm);width:28px;height:28px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:16px;font-weight:500;display:flex}.bonus-stepper-btn:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-hover)}.bonus-stepper-btn:disabled{opacity:.4;cursor:not-allowed}.bonus-points-value{color:var(--text-primary);text-align:center;font-variant-numeric:tabular-nums;min-width:24px;font-size:20px;font-weight:700}.bonus-points-hint{color:var(--text-muted);font-size:10px}.branch-totals{border-left:1px solid var(--border-default);gap:16px;padding-left:16px;display:flex}.branch-total{background:var(--bg-tertiary);border-radius:var(--radius-md);align-items:center;gap:6px;padding:6px 12px;display:flex}.branch-indicator{border-radius:50%;width:10px;height:10px}.branch-indicator--conditioning{background:#0f8;box-shadow:0 0 8px #00ff8880}.branch-indicator--mobility{background:gold;box-shadow:0 0 8px #ffd70080}.branch-indicator--survival{background:#f44;box-shadow:0 0 8px #ff444480}.branch-name{color:var(--text-secondary);font-size:12px;font-weight:500}.branch-points{color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:14px;font-weight:700}.control-btn{background:var(--bg-tertiary);border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:500;display:flex}.control-btn:hover{background:var(--bg-hover);border-color:var(--border-hover)}.control-btn:disabled{opacity:.4;cursor:not-allowed}.control-btn--primary{border-color:var(--color-primary);color:var(--color-primary);background:0 0}.control-btn--primary:hover{background:#00ff881a}.control-btn--danger{border-color:var(--color-accent-red);color:var(--color-accent-red);background:0 0}.control-btn--danger:hover{background:#ff444426}.control-btn--danger-filled{background:var(--color-accent-red);border-color:var(--color-accent-red);color:#fff}.control-btn--danger-filled:hover{background:#e03030;border-color:#e03030}.share-dropdown{position:relative}.share-menu{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-sm);min-width:160px;box-shadow:var(--shadow-lg);z-index:100;position:absolute;top:calc(100% + 6px);right:0;overflow:hidden}.share-menu-item{width:100%;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);text-align:left;background:0 0;border:none;align-items:center;gap:8px;padding:10px 14px;font-size:12px;display:flex}.share-menu-item:hover{background:var(--bg-hover);color:var(--text-primary)}.share-menu-item:first-child{border-bottom:1px solid var(--border-default)}.share-menu-item svg{opacity:.7}.share-menu-item:hover svg{opacity:1}.skill-tree-container{background:var(--bg-primary);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;overscroll-behavior:contain;flex:1;position:relative;overflow:hidden}.skill-tree-container:active{cursor:grabbing}.skill-tree-container:before{content:"";pointer-events:none;background:radial-gradient(circle at 50% 100%,#00ff8808 0%,#0000 50%),radial-gradient(circle at 30% 100%,#ffd70008 0%,#0000 40%),radial-gradient(circle at 70% 100%,#ff444408 0%,#0000 40%);position:absolute;inset:0}.skill-tree-viewport{transform-origin:50%;width:100%;height:100%;position:absolute}.skill-tree-content{width:100%;height:100%;position:absolute}.skill-tree-connections{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible}.skill-connection{stroke:var(--border-default);stroke-width:2px;fill:none;transition:stroke var(--transition-fast),stroke-width var(--transition-fast)}.skill-connection--active{stroke-width:3px}.skill-connection--conditioning{stroke:#0f86}.skill-connection--conditioning.skill-connection--active{stroke:#0f8}.skill-connection--mobility{stroke:#ffd70066}.skill-connection--mobility.skill-connection--active{stroke:gold}.skill-connection--survival{stroke:#f446}.skill-connection--survival.skill-connection--active{stroke:#f44}.skill-connection--locked{stroke:#ffffff1a}.skill-node{cursor:pointer;z-index:1;flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;transform:translate(-50%,-50%)}.skill-node-circle{border:3px solid var(--border-default);width:44px;height:44px;transition:all var(--transition-fast);box-sizing:border-box;background:#0a0e14;border-radius:50%;justify-content:center;align-items:center;padding:10px;display:flex;position:relative}.skill-node:hover .skill-node-circle{border-color:var(--border-hover);transform:scale(1.05)}.skill-node-icon{object-fit:contain;opacity:.5;width:100%;height:100%;transition:opacity var(--transition-fast),filter var(--transition-fast);pointer-events:none;-webkit-user-select:none;user-select:none}.skill-node-badge{background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:10px;padding:2px 6px;font-size:9px;font-weight:700;position:absolute;bottom:-6px;left:50%;transform:translate(-50%)}.skill-node--milestone .skill-node-circle{border-width:4px;width:64px;height:64px;padding:14px}.skill-node--milestone .skill-node-icon{width:100%;height:100%}.skill-node--milestone .skill-node-badge{padding:3px 10px;font-size:11px;bottom:-8px}.skill-node--locked .skill-node-circle{background:#0a0e14;border-color:#ffffff26}.skill-node--locked .skill-node-icon{opacity:.25}.skill-node--locked{cursor:not-allowed}.skill-node--available .skill-node-circle{border-color:var(--text-muted);background:#0a0e14}.skill-node--available .skill-node-icon{opacity:.7}.skill-node--active.skill-node--conditioning .skill-node-circle{background:#0d1a14;border-color:#0f8;box-shadow:0 0 20px #00ff884d}.skill-node--active.skill-node--conditioning .skill-node-icon{opacity:1}.skill-node--active.skill-node--conditioning.skill-node--has-points .skill-node-icon{filter:brightness(0)saturate()invert(78%)sepia(52%)saturate(1019%)hue-rotate(93deg)brightness(102%)contrast(105%)}.skill-node--active.skill-node--conditioning .skill-node-badge,.skill-node--active.skill-node--conditioning.skill-node--has-points .skill-node-badge{color:#0a0e14;background:#0f8;border-color:#0f8}.skill-node--active.skill-node--mobility .skill-node-circle{background:#1a1708;border-color:gold;box-shadow:0 0 20px #ffd7004d}.skill-node--active.skill-node--mobility .skill-node-icon{opacity:1}.skill-node--active.skill-node--mobility.skill-node--has-points .skill-node-icon{filter:brightness(0)saturate()invert(76%)sepia(67%)saturate(1000%)hue-rotate(8deg)brightness(105%)contrast(104%)}.skill-node--active.skill-node--mobility .skill-node-badge,.skill-node--active.skill-node--mobility.skill-node--has-points .skill-node-badge{color:#0a0e14;background:gold;border-color:gold}.skill-node--active.skill-node--survival .skill-node-circle{background:#1a0c0c;border-color:#f44;box-shadow:0 0 20px #ff44444d}.skill-node--active.skill-node--survival .skill-node-icon{opacity:1}.skill-node--active.skill-node--survival.skill-node--has-points .skill-node-icon{filter:brightness(0)saturate()invert(42%)sepia(93%)saturate(2575%)hue-rotate(336deg)brightness()contrast(101%)}.skill-node--active.skill-node--survival .skill-node-badge,.skill-node--active.skill-node--survival.skill-node--has-points .skill-node-badge{color:#0a0e14;background:#f44;border-color:#f44}.skill-node--available.skill-node--conditioning:hover .skill-node-circle{border-color:#0f89}.skill-node--available.skill-node--mobility:hover .skill-node-circle{border-color:#ffd70099}.skill-node--available.skill-node--survival:hover .skill-node-circle{border-color:#f449}.skill-node--maxed .skill-node-badge{animation:2s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,to{opacity:1}50%{opacity:.7}}.skill-tooltip{z-index:1000;border-radius:var(--radius-md);max-width:300px;box-shadow:var(--shadow-lg);pointer-events:none;background:#f5f0e6;margin-top:-12px;padding:16px;position:fixed;transform:translate(-50%,-100%)}.skill-tooltip:after{content:"";border:8px solid #0000;border-top-color:#f5f0e6;border-bottom:none;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.skill-tooltip-name{color:#1a1a1a;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:16px;font-weight:700}.skill-tooltip-description{color:#4a4a4a;margin-bottom:12px;font-size:14px;line-height:1.5}.skill-tooltip-requirement{text-transform:uppercase;letter-spacing:.5px;color:#1a1a1a;border-top:1px solid #0000001a;padding-top:12px;font-size:12px;font-weight:600}.skill-tooltip-requirement--unmet{color:#c00}.zoom-controls{z-index:10;flex-direction:column;gap:4px;display:flex;position:absolute;bottom:24px;right:24px}.zoom-btn{background:var(--bg-secondary);border:1px solid var(--border-default);border-radius:var(--radius-sm);width:40px;height:40px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;font-size:18px;display:flex}.zoom-btn:hover{background:var(--bg-tertiary);border-color:var(--border-hover)}.zoom-level{text-align:center;color:var(--text-muted);padding:4px 0;font-size:11px;font-weight:600}.nav-hint{color:var(--text-muted);z-index:10;flex-direction:column;gap:4px;font-size:11px;display:flex;position:absolute;bottom:24px;left:24px}.nav-hint span{align-items:center;gap:6px;display:flex}.nav-hint kbd{background:var(--bg-secondary);border:1px solid var(--border-default);border-radius:4px;justify-content:center;align-items:center;min-width:20px;padding:2px 6px;font-family:inherit;font-size:10px;display:inline-flex}.reset-modal-overlay{z-index:1000;background:#0009;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.reset-modal{background:var(--bg-secondary);border:1px solid var(--border-default);border-radius:var(--radius-md);text-align:center;max-width:360px;box-shadow:var(--shadow-lg);padding:24px 28px}.reset-modal h3{margin-bottom:8px;font-size:16px;font-weight:600}.reset-modal p{color:var(--text-secondary);margin-bottom:20px;font-size:13px;line-height:1.5}.reset-modal-actions{justify-content:center;gap:10px;display:flex}.nav-hint--mobile{display:none}@media (max-width:900px){.skill-tree-controls{flex-wrap:wrap;gap:16px}.branch-totals{border-left:none;order:3;justify-content:center;width:100%;padding-left:0}.controls-left{flex-wrap:wrap}.bonus-points-control{border-left:none;padding-left:0}}@media (max-width:768px){.skill-tree-page{height:calc(100vh - var(--mobile-header-height,52px));height:calc(100dvh - var(--mobile-header-height,52px))}.nav-hint--desktop{display:none}.nav-hint--mobile{border-radius:var(--radius-md);-webkit-backdrop-filter:blur(8px);background:#0a0e14d9;flex-flow:wrap;justify-content:center;gap:8px;max-width:none;padding:8px 12px;display:flex;bottom:12px;left:12px;right:12px}.nav-hint--mobile span{font-size:10px}.nav-hint--mobile kbd{padding:2px 4px;font-size:9px}.skill-tree-controls{z-index:9001;flex-wrap:wrap;gap:8px;padding:10px 12px}.controls-left{flex-wrap:wrap;flex:1;order:1;align-items:center;gap:10px;min-width:0;display:flex}.controls-right{flex-wrap:wrap;flex-shrink:0;order:2;place-content:flex-start flex-end;gap:6px;display:flex}.points-display{flex-shrink:0;order:1;gap:6px}.points-value{font-size:18px}.points-label{letter-spacing:.5px;font-size:9px}.bonus-points-control{border-left:1px solid var(--border-default);background:var(--bg-tertiary);border-radius:var(--radius-sm);flex-direction:row;order:2;align-items:center;gap:6px;padding:4px 8px 4px 10px}.bonus-points-label{white-space:nowrap;letter-spacing:.3px;color:var(--text-muted);font-size:8px}.bonus-points-stepper{gap:4px}.bonus-stepper-btn{border-radius:var(--radius-xs);width:28px;height:28px;font-size:16px}.bonus-points-value{min-width:16px;font-size:14px;font-weight:600}.bonus-points-hint{display:none}.branch-totals{border-top:1px solid var(--border-default);border-left:none;order:3;justify-content:flex-start;gap:8px;width:100%;margin-top:2px;padding-top:6px;padding-left:0;display:flex}.branch-total{background:var(--bg-tertiary);border-radius:var(--radius-sm);gap:5px;padding:4px 8px}.branch-indicator{width:8px;height:8px}.branch-name{font-size:11px;font-weight:500}.branch-points{font-size:12px;font-weight:700}.control-btn{min-height:40px;padding:8px 10px;font-size:11px}.control-btn span:not(.premium-tag){display:none}.control-btn svg{width:16px;height:16px}.premium-tag{display:none}.zoom-controls{bottom:80px;right:12px}.zoom-btn{width:48px;height:48px;font-size:22px}.zoom-level{padding:6px 0;font-size:12px}.skill-node-circle{width:48px;height:48px}.skill-node--milestone .skill-node-circle{width:68px;height:68px}.skill-node:active .skill-node-circle{transform:scale(.95)}.skill-tooltip{max-width:280px;padding:12px;font-size:13px}.skill-tooltip-name{font-size:14px}.skill-tooltip-description{margin-bottom:8px;font-size:12px}.reset-modal-overlay{padding:16px}.reset-modal{width:100%;max-width:none;padding:20px}.reset-modal h3{font-size:18px}.builds-menu-overlay{z-index:8999;background:#00000080;display:block;position:fixed;inset:0}.builds-menu{border-radius:var(--bottom-sheet-radius,20px)var(--bottom-sheet-radius,20px)0 0;z-index:9000;width:100%;max-height:70dvh;padding-bottom:var(--safe-area-bottom,0px);position:fixed;inset:auto 0 0;box-shadow:0 -8px 32px #0006}.builds-menu-header:before{content:"";width:var(--bottom-sheet-handle-width,40px);height:var(--bottom-sheet-handle-height,4px);background:var(--text-muted);opacity:.5;border-radius:2px;margin:8px auto;display:block}.builds-menu-header{padding-top:4px}.builds-menu-list{max-height:45vh}.builds-menu-item-load{min-height:var(--touch-target-min,44px);padding:12px 16px}.builds-menu-item-delete{width:44px;min-height:var(--touch-target-min,44px)}.builds-menu-save-btn{min-height:var(--touch-target-min,44px);font-size:14px}.share-menu{border-radius:var(--radius-lg);z-index:9000;min-width:auto;position:fixed;inset:auto 16px 45px}.share-menu-item{min-height:48px;font-size:14px}.share-menu-item-copy{display:none}.builds-dropdown{flex-basis:100%;order:3;justify-content:flex-end;display:flex}.share-dropdown{order:1}}@media (max-width:480px){.skill-tree-controls{gap:6px;padding:8px 10px}.points-value{font-size:16px}.points-label{font-size:8px}.bonus-points-control{background:var(--bg-tertiary);border-radius:var(--radius-sm);border-left:none;gap:4px;padding:4px 6px}.bonus-points-label{display:none}.bonus-stepper-btn{width:26px;height:26px;font-size:14px}.bonus-points-value{min-width:16px;font-size:13px}.branch-totals{gap:4px;padding-top:4px}.branch-total{gap:4px;padding:3px 6px}.branch-name{font-size:10px}.branch-points{font-size:11px}.control-btn{min-height:36px;padding:6px 8px}.skill-tooltip{max-width:240px;padding:10px}.zoom-controls{bottom:70px;right:8px}.zoom-btn{width:44px;height:44px;font-size:20px}.nav-hint--mobile{gap:6px;padding:6px 10px;bottom:8px;left:8px;right:8px}.nav-hint--mobile span{font-size:9px}}@media (max-height:500px) and (max-width:900px){.skill-tree-controls{padding:6px 12px}.branch-totals,.nav-hint--mobile{display:none}.zoom-controls{flex-direction:row;gap:8px;bottom:8px}.zoom-btn{width:36px;height:36px;font-size:16px}.zoom-level{align-items:center;padding:0 8px;display:flex}}.builds-dropdown{position:relative}.control-btn--premium-locked{color:#ffd54f;background:linear-gradient(135deg,#ffc10726 0%,#ff98001a 100%);border:1px solid #ffc10780;animation:3s ease-in-out infinite premium-glow;position:relative;box-shadow:0 0 12px #ffc10733,inset 0 1px #ffffff1a}.control-btn--premium-locked:hover{background:linear-gradient(135deg,#ffc10740 0%,#ff980033 100%);border-color:#ffc107b3;transform:translateY(-1px);box-shadow:0 0 20px #ffc10759,inset 0 1px #ffffff26}.control-btn--premium-locked svg{color:#ffd54f}@keyframes premium-glow{0%,to{box-shadow:0 0 12px #ffc10733,inset 0 1px #ffffff1a}50%{box-shadow:0 0 18px #ffc10759,inset 0 1px #ffffff26}}.premium-badge-mini{color:#ffc107;justify-content:center;align-items:center;margin-left:6px;animation:2s ease-in-out infinite crown-shine;display:inline-flex}.premium-badge-mini svg{filter:drop-shadow(0 0 6px #ffc107cc)}@keyframes crown-shine{0%,to{filter:brightness();transform:scale(1)}50%{filter:brightness(1.2);transform:scale(1.1)}}.premium-crown-icon{filter:drop-shadow(0 0 4px #ffc10799)}.premium-tag{letter-spacing:.5px;color:#1a1a1a;text-shadow:none;background:linear-gradient(135deg,#ffc107 0%,#ff9800 100%);border-radius:4px;justify-content:center;align-items:center;margin-left:6px;padding:2px 6px;font-size:9px;font-weight:700;display:inline-flex;box-shadow:0 2px 6px #ffc10766}.builds-menu-overlay{display:none}.builds-menu{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-md);width:260px;box-shadow:var(--shadow-lg);z-index:100;position:absolute;top:calc(100% + 6px);right:0;overflow:hidden}.builds-menu-header{border-bottom:1px solid var(--border-default);background:var(--bg-secondary);justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.builds-menu-title{color:var(--text-primary);text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:600}.builds-menu-count{color:var(--text-muted);font-variant-numeric:tabular-nums;font-size:11px}.builds-menu-loading,.builds-menu-empty{text-align:center;color:var(--text-muted);padding:20px 14px;font-size:12px}.builds-menu-list{max-height:200px;overflow-y:auto}.builds-menu-item{border-bottom:1px solid var(--border-default);align-items:center;display:flex}.builds-menu-item:last-child{border-bottom:none}.builds-menu-item-load{cursor:pointer;text-align:left;transition:background var(--transition-fast);background:0 0;border:none;flex:1;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.builds-menu-item-load:hover{background:var(--bg-hover)}.builds-menu-item-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;max-width:150px;font-size:13px;overflow:hidden}.builds-menu-item-points{color:var(--text-muted);font-variant-numeric:tabular-nums;font-size:11px}.builds-menu-item-delete{border:none;border-left:1px solid var(--border-default);width:32px;height:100%;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;padding:10px 8px;display:flex}.builds-menu-item-delete:hover{color:var(--color-accent-red);background:#ff444426}.builds-menu-footer{border-top:1px solid var(--border-default);background:var(--bg-secondary);padding:10px 14px}.builds-menu-save-btn{border:1px solid var(--color-primary);border-radius:var(--radius-sm);width:100%;color:var(--color-primary);cursor:pointer;transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;gap:6px;padding:8px 12px;font-size:12px;font-weight:500;display:flex}.builds-menu-save-btn:hover:not(:disabled){background:#00ff881a}.builds-menu-save-btn:disabled{opacity:.4;cursor:not-allowed}.save-build-modal{text-align:left}.save-build-modal h3{text-align:center}.save-build-input{background:var(--bg-tertiary);border:1px solid var(--border-default);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);transition:border-color var(--transition-fast);margin-bottom:16px;padding:10px 14px;font-size:14px}.save-build-input:focus{border-color:var(--color-primary);outline:none}.save-build-input::placeholder{color:var(--text-muted)}.save-build-input:disabled{opacity:.6;cursor:not-allowed}@media (max-width:768px){.builds-menu-overlay{z-index:8999;background:#00000080;display:block;position:fixed;inset:0}.builds-menu{border-radius:var(--bottom-sheet-radius,20px)var(--bottom-sheet-radius,20px)0 0;z-index:9000;width:100%;max-height:70dvh;padding-bottom:var(--safe-area-bottom,0px);position:fixed;inset:auto 0 45px;box-shadow:0 -8px 32px #0006}.builds-menu-header:before{content:"";width:var(--bottom-sheet-handle-width,40px);height:var(--bottom-sheet-handle-height,4px);background:var(--text-muted);opacity:.5;border-radius:2px;grid-column:1/-1;margin:12px auto 8px;display:block}.builds-menu-header{grid-template-columns:auto auto;justify-content:center;align-items:center;gap:8px;padding-top:0;padding-bottom:12px;display:grid}.builds-menu-list{max-height:45vh}.builds-menu-item-load{min-height:var(--touch-target-min,44px);padding:12px 16px}.builds-menu-item-delete{width:44px;min-height:var(--touch-target-min,44px)}.builds-menu-save-btn{min-height:var(--touch-target-min,44px);font-size:14px}}