.page-header{text-align:center;padding:6rem 0 3rem}.subtitle{max-width:650px;margin:1.5rem auto 0;font-size:1.2rem;font-weight:300}.section{padding:4rem 0}.section-desc{color:var(--color-text-secondary);font-size:1.15rem;font-weight:300;line-height:1.6}.mechanics-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2.5rem;margin-top:3.5rem;display:grid}.mechanic-card{padding:3rem 2.5rem;position:relative}.num-badge{font-family:var(--font-header);color:#5ce6e626;text-shadow:0 0 20px #5ce6e60d;margin-bottom:1rem;font-size:2.5rem;font-weight:800;line-height:1}.classifications-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2.5rem;display:grid}.class-card{border-radius:20px;flex-direction:column;padding:3rem 2.5rem;display:flex;position:relative}.class-card-header{align-items:center;gap:1rem;margin-bottom:2rem;display:flex;position:relative}.class-icon{border-radius:50%;width:24px;height:24px;position:relative}.class-card.teal .class-icon{border:1px solid var(--color-pearl-cyan);box-shadow:0 0 10px var(--color-pearl-cyan-glow);background:#5ce6e626}.class-card.teal .class-icon:after{content:"";background:var(--color-pearl-cyan);border-radius:50%;width:8px;height:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.class-card.gold .class-icon{border:1px solid var(--color-pearl-gold);box-shadow:0 0 10px var(--color-pearl-gold-glow);background:#ffd86626}.class-card.gold .class-icon:after{content:"";background:var(--color-pearl-gold);border-radius:2px;width:12px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.class-card.amethyst .class-icon{border:1px solid var(--color-pearl-lavender);box-shadow:0 0 10px var(--color-pearl-lavender-glow);background:#d67cff26}.class-card.amethyst .class-icon:after{content:"";background:var(--color-pearl-lavender);width:8px;height:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.class-card h3{font-size:1.4rem;font-weight:700}.class-limit{font-family:var(--font-header);text-transform:uppercase;letter-spacing:.05em;opacity:.75;margin-left:auto;font-size:.75rem;font-weight:700}.class-stats{background:#0006;border:1px solid #ffffff0a;border-radius:12px;justify-content:space-between;margin-bottom:2rem;padding:1.25rem;display:flex}.class-stat-item{flex-direction:column;gap:.25rem;display:flex}.stat-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-family:var(--font-header)}.stat-val{font-family:var(--font-header);color:#fff;font-size:1.1rem;font-weight:700}.stat-val.color-teal{color:var(--color-pearl-cyan)}.stat-val.color-gold{color:var(--color-pearl-gold)}.stat-val.color-amethyst{color:var(--color-pearl-lavender)}.class-desc{color:var(--color-text-secondary);margin-bottom:0;font-size:1rem;font-weight:300;line-height:1.6}.ai-grid{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2.5rem;margin-top:3.5rem;display:grid}.ai-badge{font-size:.7rem;font-family:var(--font-header);text-transform:uppercase;letter-spacing:.08em;border-radius:9999px;margin-bottom:1.5rem;padding:.35rem .85rem;font-weight:700;display:inline-block}.ai-badge.cyan{border:1px solid var(--color-pearl-cyan);color:var(--color-pearl-cyan);background:#5ce6e61a}.ai-badge.gold{border:1px solid var(--color-pearl-gold);color:var(--color-pearl-gold);background:#ffd8661a}.styled-list{flex-direction:column;gap:1rem;margin-top:1.5rem;padding-left:.25rem;list-style:none;display:flex}.styled-list li{color:var(--color-text-secondary);padding-left:1.75rem;font-size:1rem;font-weight:300;line-height:1.5;position:relative}.styled-list li strong{color:#fff;font-weight:600}.styled-list li:before{content:"";background:var(--color-pearl-cyan);width:6px;height:6px;box-shadow:0 0 8px var(--color-pearl-cyan);border-radius:50%;position:absolute;top:.65rem;left:0}.controls-container{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:3rem;margin-top:3.5rem;display:grid}.control-list{flex-direction:column;gap:1.5rem;margin-top:2rem;display:flex}.control-item{border-bottom:1px solid #ffffff0a;justify-content:space-between;align-items:center;gap:2.5rem;padding-bottom:1.25rem;display:flex}.control-item:last-child{border-bottom:none}.key-pill{font-family:var(--font-header);color:var(--color-pearl-cyan);white-space:nowrap;text-transform:uppercase;letter-spacing:.05em;background:#5ce6e614;border:1px solid #5ce6e633;border-radius:8px;padding:.45rem 1rem;font-size:.8rem;font-weight:700;box-shadow:0 4px 10px #0003}.key-pill.gold{color:var(--color-pearl-gold);background:#ffd86614;border:1px solid #ffd86633}.desc{color:var(--color-text-secondary);text-align:right;font-size:.95rem;font-weight:300;line-height:1.4}.actual-node-sprite,.guide-oracle-canvas{width:140px;height:140px;transition:var(--transition-smooth);border-radius:50%;margin:0 auto 1.5rem;display:block;position:relative}.actual-node-sprite{background-color:#02040e;background-image:url(/images/maps/node_oracle_sheet.webp);background-repeat:no-repeat;background-size:800px 496px;border:1px solid #ffffff08;box-shadow:0 0 30px #0009}.class-card:hover .actual-node-sprite,.class-card:hover .guide-oracle-canvas{filter:drop-shadow(0 0 25px #5ce6e626);transform:scale(1.06)}.class-card.teal:hover .actual-node-sprite,.class-card.teal:hover .guide-oracle-canvas{filter:drop-shadow(0 0 25px #5ce6e638)}.class-card.gold:hover .actual-node-sprite,.class-card.gold:hover .guide-oracle-canvas{filter:drop-shadow(0 0 25px #ffd86638)}.class-card.amethyst:hover .actual-node-sprite,.class-card.amethyst:hover .guide-oracle-canvas{filter:drop-shadow(0 0 25px #d67cff38)}.actual-node-sprite.small{background-position:-154px -188px}.actual-node-sprite.medium{background-position:-378px -188px}.actual-node-sprite.major{background-position:-618px -188px}.blueprints-grid{flex-direction:column;gap:4rem;margin-top:2rem;display:flex}.blueprint-card{background:#00000059;border-color:#ffffff08;border-radius:24px;padding:3rem;position:relative}.blueprint-tag{font-size:.7rem;font-family:var(--font-header);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-secondary);background:#ffffff08;border:1px solid #ffffff1a;border-radius:9999px;margin-bottom:1.5rem;padding:.35rem .85rem;font-weight:700;display:inline-block}#blueprint_structure .blueprint-tag{color:var(--color-pearl-cyan);background:#5ce6e614;border-color:#5ce6e633}#blueprint_interactions .blueprint-tag{color:var(--color-pearl-lavender);background:#d67cff14;border-color:#d67cff33}#blueprint_flows .blueprint-tag{color:var(--color-pearl-gold);background:#ffd86614;border-color:#ffd86633}.blueprint-card h3{margin-bottom:.75rem;font-size:1.6rem;font-weight:700}.blueprint-desc{color:var(--color-text-secondary);margin-bottom:2.5rem;font-size:1.05rem;font-weight:300;line-height:1.5}.blueprint-img-container{background:#000;border:1px solid #ffffff08;border-radius:16px;justify-content:center;align-items:center;width:100%;padding:2.5rem;display:flex;position:relative;overflow:hidden}.blueprint-glow{pointer-events:none;width:80%;height:80%;transition:var(--transition-smooth);background:radial-gradient(circle,#5ce6e60a 0%,#0000 70%);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#blueprint_interactions .blueprint-glow{background:radial-gradient(circle,#d67cff0a 0%,#0000 70%)}#blueprint_flows .blueprint-glow{background:radial-gradient(circle,#ffd8660a 0%,#0000 70%)}.blueprint-card:hover .blueprint-glow{opacity:1.5;width:90%;height:90%}#blueprint_structure:hover .blueprint-glow{background:radial-gradient(circle,#5ce6e60f 0%,#0000 70%)}#blueprint_interactions:hover .blueprint-glow{background:radial-gradient(circle,#d67cff0f 0%,#0000 70%)}#blueprint_flows:hover .blueprint-glow{background:radial-gradient(circle,#ffd8660f 0%,#0000 70%)}.blueprint-img{object-fit:contain;filter:drop-shadow(0 8px 24px #0009);max-width:100%;height:auto;max-height:480px;transition:var(--transition-smooth);z-index:2;border-radius:8px;position:relative}.blueprint-card:hover .blueprint-img{filter:drop-shadow(0 12px 35px #000c);transform:scale(1.015)}@media (width<=900px){.classifications-grid,.ai-grid,.controls-container{grid-template-columns:1fr;gap:2.5rem}}@media (width<=480px){.control-item{flex-direction:column;align-items:flex-start;gap:.5rem}.control-item .desc{text-align:left}.class-card{padding:1.75rem 1.25rem}.mechanic-card{padding:2rem 1.25rem}.blueprint-card{padding:1.75rem 1.25rem}.blueprint-img-container{padding:1rem}}