*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;background:#0a1e23;color:#e8f2f4;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shell{min-height:100vh;background:#0a1e23}.btn{padding:10px 20px;border-radius:12px;font-weight:700;font-size:.95rem;cursor:pointer;border:none;transition:all .2s ease;display:inline-flex;align-items:center;gap:8px}.btn:hover{transform:translateY(-2px);filter:brightness(1.1)}.btn.primary{background:linear-gradient(90deg,#06b6d4,#10b981);color:#062022;box-shadow:0 4px 16px #10b9814d}.btn.alt,.btn.secondary{background:#ffffff0d;color:#e8f2f4;border:1px solid rgba(255,255,255,.08)}.btn.small{padding:8px 16px;font-size:.9rem}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.card{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:20px;margin-bottom:16px}.input,input[type=text],input[type=number],input[type=email],textarea,select{width:100%;padding:12px 14px;border-radius:12px;background:#ffffff0d;color:#e8f2f4;border:1px solid rgba(255,255,255,.12);outline:none;font-size:1rem;transition:all .2s ease}.input:focus,input:focus,textarea:focus,select:focus{border-color:#06b6d466;background:#ffffff14}.small{font-size:.85rem}.text-center{text-align:center}.mt-20{margin-top:20px}.mb-20{margin-bottom:20px}@media(max-width:750px){.btn{padding:12px 16px;font-size:.9rem}.card{padding:16px}}.role-chip{display:inline-flex;align-items:center;padding:6px 12px;border-radius:10px;font-size:.85rem;font-weight:600;color:#fff;background:#ffffff14;border:1px solid rgba(255,255,255,.12);margin-right:8px;margin-bottom:6px;white-space:nowrap}.role-chip.maintainer{background:#00ffb42e;border-color:#00ffb44d;color:#00ffb4}.role-chip.validator{background:#5a96ff33;border-color:#5a96ff4d;color:#7fb4ff}.role-chip.steward{background:#ffd78738;border-color:#ffd78759;color:#ffd48a}.role-chip:hover{filter:brightness(1.15);cursor:default}.btn.role-locked{opacity:.45!important;cursor:not-allowed!important;border-style:dashed!important;border-color:#ffffff40!important}.btn.role-locked:after{content:"🔒";margin-left:6px;font-size:.9rem;opacity:.8}.tree-visualization{position:relative;width:100%;max-width:600px;margin:0 auto;padding:40px 20px;background:linear-gradient(180deg,#0a2e35f2,#05171bfa);border-radius:24px;border:2px solid rgba(14,232,183,.2);overflow:hidden;box-shadow:0 20px 60px #00000080,inset 0 0 80px #0ee8b70d}.binary-rain{position:absolute;inset:0;overflow:hidden;opacity:.15;pointer-events:none;z-index:0}.binary-drop{position:absolute;top:-20px;font-family:Courier New,monospace;font-size:14px;color:#0ee8b7;font-weight:700;animation:rain-fall linear infinite;text-shadow:0 0 8px rgba(14,232,183,.8)}@keyframes rain-fall{0%{transform:translateY(-20px);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(600px);opacity:0}}.tree-container{position:relative;z-index:1;min-height:400px;display:flex;flex-direction:column;align-items:center;transition:all .8s cubic-bezier(.4,0,.2,1)}.tree-container.glow{filter:drop-shadow(0 0 20px rgba(14,232,183,.3))}.tree-svg{width:100%;max-width:280px;height:auto;filter:drop-shadow(0 0 10px rgba(14,232,183,.4));transition:all .8s ease-out}.tree-svg.mature{filter:drop-shadow(0 0 30px rgba(14,232,183,.6))}.stage-seedling .tree-svg{transform:scale(.7);opacity:.8}.stage-sapling .tree-svg{transform:scale(.85);opacity:.9}.stage-young-tree .tree-svg{transform:scale(.95);opacity:.95}.stage-mature-tree .tree-svg{transform:scale(1);opacity:1}.tree-stem,.tree-trunk{animation:grow-up 1.5s ease-out;stroke-dasharray:200;stroke-dashoffset:200;animation:draw-path 2s ease-out forwards}.tree-trunk.mature{animation:draw-path 2s ease-out forwards,pulse-glow 3s ease-in-out infinite}@keyframes draw-path{to{stroke-dashoffset:0}}@keyframes grow-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.tree-leaf,.tree-frond{animation:grow-leaf 1s ease-out backwards;transform-origin:center}.tree-frond.mature{animation:grow-leaf 1s ease-out backwards,sway 4s ease-in-out infinite}@keyframes grow-leaf{0%{opacity:0;stroke-dasharray:100;stroke-dashoffset:100}to{opacity:1;stroke-dashoffset:0}}@keyframes sway{0%,to{transform:rotate(0)}50%{transform:rotate(2deg)}}.tree-glow{animation:glow-pulse 2s ease-in-out infinite}.tree-glow-pulse{animation:glow-pulse-large 3s ease-in-out infinite}.tree-glow-pulse-large{animation:glow-pulse-huge 4s ease-in-out infinite}@keyframes glow-pulse{0%,to{opacity:.3;r:5}50%{opacity:.7;r:8}}@keyframes glow-pulse-large{0%,to{opacity:.2;r:15}50%{opacity:.5;r:20}}@keyframes glow-pulse-huge{0%,to{opacity:.1;r:35}50%{opacity:.3;r:45}}.coconut{animation:coconut-bounce 3s ease-in-out infinite}.coconut-cluster{transform-origin:center;animation:cluster-sway 4s ease-in-out infinite}@keyframes coconut-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes cluster-sway{0%,to{transform:translate(0) rotate(0)}50%{transform:translate(2px) rotate(1deg)}}.frond-group-left,.frond-group-left-2,.frond-group-right,.frond-group-right-2,.frond-group-top,.frond-group-top-right{transform-origin:135px 140px}.frond-group-left{animation:sway-left 5s ease-in-out infinite}.frond-group-right{animation:sway-right 5s ease-in-out infinite}@keyframes sway-left{0%,to{transform:rotate(0)}50%{transform:rotate(-2deg)}}@keyframes sway-right{0%,to{transform:rotate(0)}50%{transform:rotate(2deg)}}.binary-code{animation:code-fade 2s ease-in-out infinite}.binary-flow{animation:flow-up 3s linear infinite}@keyframes code-fade{0%,to{opacity:.4}50%{opacity:.8}}@keyframes flow-up{0%{opacity:0;transform:translateY(20px)}20%{opacity:.7}80%{opacity:.7}to{opacity:0;transform:translateY(-100px)}}@keyframes pulse-glow{0%,to{filter:drop-shadow(0 0 5px rgba(14,232,183,.5))}50%{filter:drop-shadow(0 0 15px rgba(14,232,183,.8))}}.root-badge{margin-top:30px;padding:16px 24px;background:#0ee8b70d;border:2px solid rgba(14,232,183,.3);border-radius:16px;text-align:center;animation:badge-appear .8s ease-out .5s backwards}.badge-code{font-family:Courier New,monospace;font-size:11px;color:#0ee8b7;opacity:.6;margin-bottom:4px;letter-spacing:2px}.badge-name{font-size:20px;font-weight:800;color:#0ee8b7;margin-bottom:4px;text-shadow:0 0 20px rgba(14,232,183,.5)}.badge-sop{font-size:12px;color:#6b8894;font-weight:600;letter-spacing:1px}@keyframes badge-appear{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.branches-container{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:30px;padding:0 20px}.branch-node{padding:12px 20px;background:linear-gradient(135deg,#0ee8b71a,#0ee8b70d);border:1px solid rgba(14,232,183,.3);border-radius:12px;animation:node-appear .6s ease-out backwards;transition:all .3s ease}.branch-node:hover{transform:translateY(-4px);border-color:#0ee8b799;box-shadow:0 8px 20px #0ee8b733}.branch-code{font-family:Courier New,monospace;font-size:10px;color:#0ee8b7;opacity:.5;margin-bottom:4px}.branch-name{font-size:14px;font-weight:700;color:#e8f2f4}@keyframes node-appear{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.pids-container{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:20px;padding:0 20px}.pid-node{padding:8px 16px;background:#0ee8b714;border:1px solid rgba(14,232,183,.2);border-radius:20px;font-size:12px;font-weight:600;color:#0ee8b7;animation:node-appear .4s ease-out backwards;transition:all .3s ease;font-family:Courier New,monospace}.pid-node:hover{background:#0ee8b726;border-color:#0ee8b780;transform:scale(1.05)}.progress-display{margin-top:30px;padding:0 20px}.progress-bar-container{width:100%;height:8px;background:#0ee8b71a;border-radius:8px;overflow:hidden;border:1px solid rgba(14,232,183,.2);box-shadow:inset 0 2px 8px #0000004d}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#0ee8b7,#10b981,#0ee8b7);border-radius:8px;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px #0ee8b799;position:relative;overflow:hidden}.progress-bar-fill:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{to{left:100%}}.progress-text{text-align:center;margin-top:12px;font-size:14px;font-weight:700;color:#0ee8b7;text-shadow:0 0 10px rgba(14,232,183,.5);letter-spacing:.5px}.eligible-badge{margin-top:30px;padding:20px 32px;background:linear-gradient(135deg,#0ee8b733,#10b98133);border:3px solid #0EE8B7;border-radius:20px;text-align:center;font-size:20px;font-weight:900;color:#0ee8b7;text-transform:uppercase;letter-spacing:2px;animation:eligible-pulse 1.5s ease-in-out infinite;position:relative;box-shadow:0 0 40px #0ee8b766,inset 0 0 30px #0ee8b71a}.eligible-pulse{position:absolute;inset:0;border:3px solid #0EE8B7;border-radius:20px;animation:pulse-ring 2s ease-out infinite}@keyframes eligible-pulse{0%,to{transform:scale(1);box-shadow:0 0 40px #0ee8b766,inset 0 0 30px #0ee8b71a}50%{transform:scale(1.02);box-shadow:0 0 60px #0ee8b799,inset 0 0 40px #0ee8b733}}@keyframes pulse-ring{0%{transform:scale(1);opacity:1}to{transform:scale(1.2);opacity:0}}@media(max-width:640px){.tree-visualization{padding:30px 15px}.tree-svg{max-width:220px}.root-badge{padding:12px 16px}.badge-name{font-size:16px}.branches-container,.pids-container{gap:10px}.branch-node{padding:10px 16px}.branch-name{font-size:12px}.pid-node{padding:6px 12px;font-size:11px}.eligible-badge{font-size:16px;padding:16px 24px}}
