.attributes-guide{min-height:100vh;background:linear-gradient(180deg,#000,#0a0a0a 50%,#000);color:#ffffff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.6}.guide-header{max-width:900px;margin:0 auto;padding:4rem 2rem 2rem;text-align:center;position:relative}.back-link{display:inline-flex;align-items:center;gap:.5rem;color:#a78bfa;text-decoration:none;font-weight:600;font-size:1rem;margin-bottom:2rem;transition:all .2s;padding:.5rem 1rem;border-radius:6px;background:rgba(139,92,246,.05);border:1px solid rgba(139,92,246,.2)}.back-link:hover{color:#8b5cf6;background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.4);transform:translateX(-4px)}.guide-header h1{font-size:3.5rem;font-weight:900;margin:0 0 1rem;letter-spacing:-.02em;background:linear-gradient(135deg,#ef4444,#10b981 50%,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.guide-subtitle{font-size:1.25rem;color:#999;margin:0;line-height:1.6}.guide-section{max-width:900px;margin:0 auto;padding:3rem 2rem}.guide-section h2{font-size:2.5rem;font-weight:800;margin:0 0 2rem;color:#ffffff;letter-spacing:-.01em}.guide-section h3{font-size:1.5rem;font-weight:700;margin:2rem 0 1rem;color:#ffffff}.guide-section h4{font-size:1.25rem;font-weight:700;margin:1.5rem 0 .75rem;color:#a78bfa}.guide-section p{font-size:1.125rem;color:#e0e0e0;line-height:1.8;margin:0 0 1.5rem}.guide-section ul{list-style:none;padding:0;margin:1rem 0}.guide-section ul li{font-size:1.125rem;color:#e0e0e0;line-height:1.8;margin-bottom:1rem;padding-left:2rem;position:relative}.guide-section ul li:before{content:"→";position:absolute;left:0;font-size:1.25rem}.guide-section ul li strong,.guide-section ul li:before{color:#a78bfa;font-weight:700}.info-box{display:flex;gap:1.5rem;padding:2rem;border-radius:12px;margin:2rem 0;background:rgba(139,92,246,.05);border:2px solid rgba(139,92,246,.2)}.info-box.strength-box{background:rgba(239,68,68,.05);border-color:rgba(239,68,68,.3)}.info-box.agility-box{background:rgba(16,185,129,.05);border-color:rgba(16,185,129,.3)}.info-box.intelligence-box{background:rgba(59,130,246,.05);border-color:rgba(59,130,246,.3)}.info-box.critical{background:rgba(251,191,36,.05);border-color:rgba(251,191,36,.3)}.info-box.universal-box{background:linear-gradient(135deg,rgba(239,68,68,.05),rgba(16,185,129,.05),rgba(59,130,246,.05));border:2px solid rgba(139,92,246,.3)}.info-icon{font-size:3rem;flex-shrink:0;line-height:1}.info-content{flex:1 1}.info-content h3{margin-top:0;margin-bottom:.5rem;font-size:1.5rem}.info-content p{margin-bottom:.75rem}.attributes-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0}.attribute-card{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;text-align:center;transition:all .3s;border:2px solid transparent}.attribute-card.strength{border-color:rgba(239,68,68,.3)}.attribute-card.agility{border-color:rgba(16,185,129,.3)}.attribute-card.intelligence{border-color:rgba(59,130,246,.3)}.attribute-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(139,92,246,.2)}.attribute-card.strength:hover{box-shadow:0 8px 30px rgba(239,68,68,.3)}.attribute-card.agility:hover{box-shadow:0 8px 30px rgba(16,185,129,.3)}.attribute-card.intelligence:hover{box-shadow:0 8px 30px rgba(59,130,246,.3)}.attribute-icon{margin:0 auto 1rem;color:#a78bfa}.attribute-card.strength .attribute-icon{color:#ef4444}.attribute-card.agility .attribute-icon{color:#10b981}.attribute-card.intelligence .attribute-icon{color:#3b82f6}.attribute-card h4{font-size:1.5rem;margin:0 0 .5rem;color:#ffffff}.attribute-color{font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin:.5rem 0 1rem}.attribute-card.strength .attribute-color{color:#ef4444}.attribute-card.agility .attribute-color{color:#10b981}.attribute-card.intelligence .attribute-color{color:#3b82f6}.attribute-desc{font-size:1rem;color:#999;margin:0}.key-concept{background:rgba(139,92,246,.1);border:2px solid rgba(139,92,246,.3);border-radius:12px;padding:2rem;margin:2rem 0}.key-concept h3{color:#a78bfa;margin-top:0}.stat-breakdown{display:flex;flex-direction:column;gap:2rem;margin:2rem 0}.stat-item{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;border-left:4px solid #a78bfa}.stat-item.primary-bonus{border-left-color:#fbbf24;background:rgba(251,191,36,.05)}.stat-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.stat-icon{font-size:1.75rem}.stat-header h4{margin:0;font-size:1.25rem}.stat-value{font-size:1.125rem;font-weight:700;color:#a78bfa;margin:.5rem 0}.stat-item.primary-bonus .stat-value{color:#fbbf24}.stat-desc{font-size:1rem;color:#ccc;margin:.75rem 0}.stat-example{background:rgba(139,92,246,.1);border-radius:8px;padding:1rem;margin-top:1rem;font-family:Courier New,monospace;font-size:.95rem}.stat-example strong{color:#a78bfa}.hero-examples{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.hero-category{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem}.hero-category h4{margin-top:0;color:#a78bfa}.pro-tip{background:rgba(139,92,246,.1);border:2px solid rgba(139,92,246,.3);border-left:4px solid #a78bfa;border-radius:12px;padding:2rem;margin:2rem 0}.pro-tip h4{color:#a78bfa;margin-top:0}.pro-tip p{margin:0;color:#e0e0e0}.armor-formula{margin:2rem 0}.formula-box{background:rgba(16,185,129,.1);border:2px solid rgba(16,185,129,.3);border-radius:12px;padding:2rem;margin:1.5rem 0}.formula{font-family:Courier New,monospace;font-size:1.125rem;color:#10b981;font-weight:700;margin:0 0 .5rem}.formula-note{font-size:.95rem;color:#999;margin:0}.armor-table{display:flex;flex-direction:column;gap:.5rem;margin:1.5rem 0}.armor-row{display:grid;grid-template-columns:1fr 1.5fr 1fr;grid-gap:1rem;gap:1rem;padding:.75rem 1rem;background:rgba(16,185,129,.05);border-radius:8px}.armor-row.header{background:rgba(16,185,129,.15);font-weight:700;color:#10b981}.spell-amp-details{margin:2rem 0}.spell-amp-example{background:rgba(59,130,246,.05);border:1px solid rgba(59,130,246,.2);border-radius:12px;padding:2rem;margin:1.5rem 0}.spell-amp-example h4{color:#3b82f6;margin-top:0}.calculation{display:flex;flex-direction:column;gap:.5rem;margin:1rem 0;padding:1rem;background:rgba(0,0,0,.3);border-radius:8px}.calculation p{margin:0;font-family:Courier New,monospace}.calculation .result{font-weight:700;color:#3b82f6;padding-top:.5rem;border-top:1px solid rgba(59,130,246,.3);margin-top:.5rem}.primary-attribute-breakdown{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0}.primary-card{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;text-align:center;border:2px solid transparent}.primary-card.str-primary{border-color:rgba(239,68,68,.3)}.primary-card.agi-primary{border-color:rgba(16,185,129,.3)}.primary-card.int-primary{border-color:rgba(59,130,246,.3)}.primary-icon{font-size:3rem;margin-bottom:1rem}.primary-bonus{font-size:1.25rem;font-weight:700;color:#fbbf24;margin:1rem 0}.primary-desc{font-size:1rem;color:#ccc;margin:1rem 0}.example-items{background:rgba(139,92,246,.1);border-radius:8px;padding:1rem;margin-top:1rem;font-size:.9rem}.example-items strong{color:#a78bfa;display:block;margin-bottom:.5rem}.strategy-section{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.strategy-point{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;border-left:4px solid #a78bfa}.strategy-point h4{margin-top:0;color:#a78bfa}.damage-calculation{margin:2rem 0}.calc-example{background:rgba(251,191,36,.05);border:1px solid rgba(251,191,36,.2);border-radius:12px;padding:2rem}.calc-example h4{color:#fbbf24;margin-top:0}.calc-breakdown{display:flex;flex-direction:column;gap:.5rem;margin:1rem 0}.calc-breakdown p{margin:0;font-family:Courier New,monospace;font-size:1rem}.calc-result{font-weight:700;color:#fbbf24;font-size:1.125rem;padding-top:.75rem;border-top:2px solid rgba(251,191,36,.3);margin-top:.75rem}.calc-note{font-size:.9rem;color:#999;font-style:italic}.universal-mechanics{margin:2rem 0}.mechanic-box{background:rgba(139,92,246,.1);border:2px solid rgba(139,92,246,.3);border-radius:12px;padding:2rem;margin-bottom:1.5rem}.mechanic-box h4{color:#a78bfa;margin-top:0}.mechanic-desc{color:#ccc}.universal-example{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;margin:1.5rem 0}.universal-example h4{color:#a78bfa;margin-top:0}.calc-steps{display:flex;flex-direction:column;gap:.5rem;margin:1rem 0}.calc-steps p{margin:0;font-family:Courier New,monospace;padding:.5rem 1rem;background:rgba(139,92,246,.05);border-radius:6px}.comparison{color:#999;font-style:italic;margin-top:1rem}.result{font-weight:700;color:#a78bfa;margin-top:1rem}.universal-heroes-list{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:.75rem;gap:.75rem;margin:2rem 0}.hero-row{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:rgba(139,92,246,.05);border-radius:8px;border:1px solid rgba(139,92,246,.2);transition:all .3s}.hero-row:hover{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.4);transform:translateX(4px)}.hero-name{font-weight:700;color:#ffffff}.hero-role{font-size:.9rem;color:#999}.universal-itemization{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.itemization-principle{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;border-left:4px solid #a78bfa}.itemization-principle h4{margin-top:0;color:#a78bfa}.attribute-gain-mechanics{margin:2rem 0}.gain-explanation{background:rgba(139,92,246,.05);border:1px solid rgba(139,92,246,.2);border-radius:12px;padding:2rem;margin-bottom:1.5rem}.gain-explanation h4{color:#a78bfa;margin-top:0}.gain-example{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;margin:1.5rem 0}.gain-example h4{color:#a78bfa;margin-top:0}.hero-stats{font-family:Courier New,monospace;font-size:.95rem;line-height:1.8}.hero-stats p{margin:.5rem 0}.hero-stats strong{color:#a78bfa;display:block;margin-top:1rem;margin-bottom:.5rem}.gain-categories{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.category-card{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;border-left:4px solid #999}.category-card.high-gain{border-left-color:#10b981}.category-card.medium-gain{border-left-color:#fbbf24}.category-card.low-gain{border-left-color:#ef4444}.category-card h4{margin-top:0}.category-card.high-gain h4{color:#10b981}.category-card.medium-gain h4{color:#fbbf24}.category-card.low-gain h4{color:#ef4444}.category-desc{color:#ccc;margin:.75rem 0 1.5rem}.category-examples{background:rgba(139,92,246,.05);border-radius:8px;padding:1.5rem}.category-examples p{margin:0 0 .75rem}.category-examples strong{color:#a78bfa}.power-curves{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0}.curve-section{background:rgba(0,0,0,.3);border-radius:12px;padding:1.5rem;text-align:center}.curve-section h4{margin-top:0;color:#a78bfa}.talent-bonus{background:rgba(251,191,36,.05);border:1px solid rgba(251,191,36,.2);border-radius:12px;padding:2rem;margin:2rem 0}.talent-bonus h3{color:#fbbf24}.talent-note{font-size:.95rem;color:#999;font-style:italic;margin-top:1rem}.items-category{margin:3rem 0}.category-title{font-size:1.75rem;font-weight:700;margin-bottom:1.5rem;padding-bottom:.5rem;border-bottom:2px solid rgba(139,92,246,.3)}.category-title.strength-title{color:#ef4444;border-bottom-color:rgba(239,68,68,.3)}.category-title.agility-title{color:#10b981;border-bottom-color:rgba(16,185,129,.3)}.category-title.intelligence-title{color:#3b82f6;border-bottom-color:rgba(59,130,246,.3)}.category-title.all-stats-title{color:#a78bfa;border-bottom-color:rgba(139,92,246,.3)}.items-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:1rem;gap:1rem;margin:1.5rem 0}.item-card{background:rgba(0,0,0,.3);border-radius:12px;padding:1.5rem;border-left:4px solid #a78bfa;transition:all .3s}.item-card:hover{background:rgba(139,92,246,.05);transform:translateX(4px)}.item-card strong{color:#a78bfa;font-size:1.125rem;display:block;margin-bottom:.75rem}.item-stats{font-size:.95rem;color:#10b981;margin:.5rem 0;font-family:Courier New,monospace}.item-passive{font-size:.9rem;color:#ccc;margin:.5rem 0}.item-cost{font-size:.85rem;color:#fbbf24;margin-top:.75rem;font-weight:700}.early-items-section{margin:2rem 0}.early-items-list{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}.early-item{background:rgba(139,92,246,.05);border-radius:8px;padding:1rem 1.5rem;border-left:3px solid #a78bfa}.early-item strong{color:#a78bfa}.priority-scenarios{display:flex;flex-direction:column;gap:2rem;margin:2rem 0}.scenario-card{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem;border-left:4px solid #a78bfa}.scenario-card h4{margin-top:0;color:#a78bfa;font-size:1.35rem}.scenario-desc{color:#ccc;margin:1rem 0}.item-recommendations{background:rgba(139,92,246,.1);border-radius:8px;padding:1rem;margin-top:1.5rem}.item-recommendations strong{color:#a78bfa;display:block;margin-bottom:.5rem}.balance-strategy{display:flex;flex-direction:column;gap:1.5rem;margin:2rem 0}.balance-principle{background:rgba(0,0,0,.3);border-radius:12px;padding:2rem}.balance-principle h4{margin-top:0;color:#a78bfa}.timing-phases{display:flex;flex-direction:column;gap:.75rem;margin:1rem 0}.phase{background:rgba(139,92,246,.05);border-radius:8px;padding:1rem;border-left:3px solid #a78bfa}.phase strong{color:#a78bfa;display:block;margin-bottom:.25rem}.mistakes-section{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0}.mistake{background:rgba(239,68,68,.05);border:1px solid rgba(239,68,68,.2);border-radius:12px;padding:1.5rem}.mistake h4{color:#ef4444;margin-top:0}.mistake-desc{color:#ccc;font-size:1rem;margin:.75rem 0}.fix{background:rgba(16,185,129,.1);border-left:3px solid #10b981;padding:.75rem;margin-top:1rem;border-radius:6px;font-size:.95rem}.fix strong{color:#10b981}.role-priorities{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:1.5rem;gap:1.5rem;margin:2rem 0}.role-card{background:rgba(0,0,0,.3);border-radius:12px;padding:1.5rem;border-left:4px solid #a78bfa}.role-card h4{margin-top:0;color:#a78bfa}.priority-order{font-size:.95rem;color:#fbbf24;margin:.75rem 0}.priority-order strong{color:#fbbf24}.cta-section{text-align:center;padding:4rem 2rem;background:linear-gradient(135deg,rgba(139,92,246,.08),rgba(0,0,0,.5));border-top:1px solid rgba(139,92,246,.2);border-bottom:1px solid rgba(139,92,246,.2)}.cta-section h2{margin-bottom:1rem}.cta-section p{max-width:700px;margin:0 auto 2rem}.cta-buttons{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}.cta-button{display:inline-flex;align-items:center;gap:.5rem;padding:1.25rem 3rem;border-radius:10px;font-size:1.125rem;font-weight:700;text-decoration:none;transition:all .3s;border:2px solid transparent}.cta-button.primary{background:linear-gradient(135deg,#a78bfa,#8b5cf6);color:#000;box-shadow:0 4px 20px rgba(139,92,246,.3)}.cta-button.primary:hover{background:linear-gradient(135deg,#8b5cf6,#7c3aed);transform:translateY(-2px);box-shadow:0 6px 30px rgba(139,92,246,.5)}.cta-button.secondary{background:transparent;color:#a78bfa;border-color:rgba(139,92,246,.4)}.cta-button.secondary:hover{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.6);color:#8b5cf6}.guide-footer{max-width:900px;margin:0 auto;padding:3rem 2rem 4rem;text-align:center;border-top:1px solid rgba(139,92,246,.1)}.guide-footer p{font-size:1rem;color:#999;margin:0 0 .5rem}.footer-link{color:#a78bfa;text-decoration:none;font-weight:600;transition:color .2s}.footer-link:hover{color:#8b5cf6}@media (max-width:1024px){.attributes-grid,.items-grid,.mistakes-section,.power-curves,.primary-attribute-breakdown,.role-priorities,.universal-heroes-list{grid-template-columns:1fr}.guide-header h1{font-size:2.5rem}.guide-section h2{font-size:2rem}}@media (max-width:768px){.guide-header{padding:3rem 1.5rem 1.5rem}.guide-header h1{font-size:2rem}.guide-subtitle{font-size:1rem}.guide-section{padding:2rem 1.5rem}.guide-section h2{font-size:1.75rem}.guide-section h3{font-size:1.25rem}.guide-section h4{font-size:1.125rem}.guide-section p,.guide-section ul li{font-size:1rem}.info-box{flex-direction:column;padding:1.5rem}.info-icon{font-size:2.5rem}.cta-buttons{flex-direction:column;width:100%}.cta-button{width:100%;justify-content:center}}@media (max-width:480px){.guide-header{padding:2rem 1rem 1rem}.guide-header h1{font-size:1.75rem}.guide-subtitle{font-size:.9rem}.guide-section{padding:1.5rem 1rem}.guide-section h2{font-size:1.5rem}.guide-section h3{font-size:1.125rem}.guide-section p,.guide-section ul li{font-size:.9375rem}.back-link{font-size:.875rem;padding:.4rem .75rem}.info-box{padding:1.25rem}.info-icon{font-size:2rem}.cta-section{padding:3rem 1rem}.cta-button{padding:1rem 2rem;font-size:1rem}.guide-footer{padding:2rem 1rem 3rem}}