:root{--bg: #080808;--bg-card: #101010;--bg-hover: #181818;--border: #2a2a2a;--border-glow: #00ff00;--border-warn: #ff8800;--border-info: #4488ff;--text: #e0e0e0;--text-dim: #888888;--text-muted: #444444;--green: #00ff00;--orange: #ff8800;--blue: #4488ff;--red: #ff4444;--gold: #ffd700}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:"Press Start 2P",monospace;font-size:10px;image-rendering:pixelated;overflow-x:hidden}.screen{display:flex;flex-direction:column;min-height:100vh}.login-screen{position:relative;align-items:center;justify-content:center;overflow:hidden}.login-bg{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;opacity:.15}.login-bg canvas{width:100%;height:100%}.login-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:32px;padding:40px 20px}.logo-area{display:flex;flex-direction:column;align-items:center;gap:12px}.logo-area canvas{filter:drop-shadow(0 0 20px #00ff0055)}.game-title{font-size:26px;color:var(--green);text-shadow:3px 3px 0 #003300,6px 6px 0 #001a00;letter-spacing:6px}.game-subtitle{font-size:11px;color:var(--text-dim);letter-spacing:2px}.login-box{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;max-width:340px}.login-desc{font-size:8px;color:var(--text-muted);text-align:center;letter-spacing:1px;margin-bottom:6px}.login-hint{font-size:7px;color:var(--text-muted)}.login-hint a{color:var(--green);text-decoration:none}.login-username-field{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:2px solid var(--border);padding:0 14px;transition:border-color .15s}.login-username-field:focus-within{border-color:var(--green)}.login-at{color:var(--text-muted);font-family:"Press Start 2P",monospace;font-size:12px;flex-shrink:0;-webkit-user-select:none;user-select:none}.login-username-input{flex:1;padding:12px 0;border:none;outline:none;background:transparent;color:var(--text);font-family:"Press Start 2P",monospace;font-size:9px}.login-username-input::placeholder{color:var(--text-muted)}.pixel-btn{font-family:"Press Start 2P",monospace;font-size:9px;padding:11px 22px;cursor:pointer;border:2px solid var(--border);background:var(--bg-card);color:var(--text);transition:all .08s;white-space:nowrap}.pixel-btn:hover{border-color:var(--green);color:var(--green);background:#0a1a0a;box-shadow:0 0 12px #0f03}.pixel-btn:active{transform:translate(1px,1px);box-shadow:none}.pixel-btn:disabled{opacity:.4;cursor:default}.pixel-btn:disabled:hover{border-color:var(--border);color:var(--text);background:var(--bg-card);box-shadow:none}.btn-primary{border-color:var(--green);color:var(--green);box-shadow:0 0 10px #0f02}.btn-primary:hover{background:#001a00;box-shadow:0 0 20px #0f04}.btn-secondary{border-color:var(--border);color:var(--text-dim)}.btn-orange{border-color:var(--orange);color:var(--orange)}.btn-orange:hover{border-color:var(--orange);color:var(--orange);background:#1a0800;box-shadow:0 0 12px #f803}.btn-blue{border-color:var(--blue);color:var(--blue)}.btn-blue:hover{border-color:var(--blue);color:var(--blue);background:#000a1a;box-shadow:0 0 12px #48f3}.btn-full{width:100%}.btn-sm{font-size:7px;padding:7px 12px}.game-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--bg-card);border-bottom:2px solid var(--border);gap:12px;flex-wrap:wrap;position:sticky;top:0;z-index:100}.header-brand{display:flex;align-items:center;gap:8px;color:var(--green);font-size:10px}.header-nav{display:flex;gap:4px}.nav-btn{font-family:"Press Start 2P",monospace;font-size:8px;padding:8px 14px;background:transparent;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:all .08s}.nav-btn:hover,.nav-btn.active{color:var(--green);border-color:var(--green);background:#001a00}.header-player{position:relative}.player-area{display:flex;flex-direction:column;align-items:flex-end;gap:3px;background:none;border:none;cursor:pointer;padding:4px 6px;border:1px solid transparent;transition:border-color .1s}.player-area:hover,.player-area.player-open{border-color:var(--border)}.player-name{font-size:9px;color:var(--green);font-family:"Press Start 2P",monospace}.hive-balance{font-size:8px;color:var(--orange);font-family:"Press Start 2P",monospace}.player-chevron{font-size:6px;color:var(--text-muted);align-self:flex-end}.player-menu{position:absolute;top:calc(100% + 4px);right:0;background:var(--bg-card);border:1px solid var(--green);min-width:110px;z-index:100;animation:fadeIn .1s ease}.player-menu-item{display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;font-family:"Press Start 2P",monospace;font-size:8px;padding:10px 12px;color:var(--text);transition:background .1s}.player-menu-item:hover{background:#0a1a0a}.player-menu-exit{color:#f66}.player-menu-exit:hover{background:#1a0505}.page{flex:1;padding:20px;max-width:1100px;width:100%;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;flex-wrap:wrap;gap:10px}.page-title{font-size:13px;color:var(--green);margin-bottom:6px}.page-subtitle{font-size:8px;color:var(--text-dim)}.garden-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width: 800px){.garden-grid{grid-template-columns:repeat(2,1fr)}}.tree-slot{background:var(--bg-card);border:2px solid var(--border);display:flex;flex-direction:column;min-height:360px;position:relative;overflow:hidden;transition:border-color .2s}.slot-active{border-color:var(--border-glow)}.slot-ready{border-color:var(--orange);animation:pulse-ready 2.4s ease-in-out infinite}@keyframes pulse-ready{0%,to{box-shadow:0 0 8px #f802}50%{box-shadow:0 0 24px #f805}}.slot-helped-1{border-color:#0f8;animation:pulse-h1 2.2s ease-in-out infinite}@keyframes pulse-h1{0%,to{box-shadow:0 0 6px #0f82}50%{box-shadow:0 0 22px #0f86}}.slot-helped-2{border-color:var(--blue);animation:pulse-h2 2s ease-in-out infinite}@keyframes pulse-h2{0%,to{box-shadow:0 0 8px #48f3}50%{box-shadow:0 0 28px #48f7}}.slot-helped-3{border-color:#93f;animation:pulse-h3 1.8s ease-in-out infinite}@keyframes pulse-h3{0%,to{box-shadow:0 0 8px #93f3}50%{box-shadow:0 0 32px #93f8}}.slot-helped-4{border-color:var(--gold);animation:pulse-h4 1.5s ease-in-out infinite}@keyframes pulse-h4{0%,to{box-shadow:0 0 10px #ffd70033}50%{box-shadow:0 0 36px #ffd70099}}.slot-empty{border-style:dashed;border-color:var(--border);cursor:pointer;align-items:center;justify-content:center}.slot-empty:hover{border-color:var(--green);background:#0a1a0a}.slot-locked{border-style:dashed;opacity:.4;cursor:default}.slot-header{padding:10px 10px 6px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:flex-start;gap:6px}.slot-tree-name{font-size:8px;color:var(--text);margin-bottom:3px}.slot-production{font-size:7px;color:var(--text-dim)}.slot-header-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.slot-wrench{cursor:pointer;width:16px;height:16px;border-radius:50%;border:1.5px solid var(--green);color:var(--green);font-size:10px;font-style:italic;font-family:Georgia,serif;font-weight:700;display:flex;align-items:center;justify-content:center;opacity:.45;transition:opacity .15s,background .15s;line-height:1;-webkit-user-select:none;user-select:none;flex-shrink:0}.slot-wrench:hover{opacity:1;background:#00c8501f}.slot-refresh{position:relative;cursor:pointer;width:16px;height:16px;border-radius:50%;border:1.5px solid var(--red);color:var(--red);font-size:12px;display:flex;align-items:center;justify-content:center;line-height:1;-webkit-user-select:none;user-select:none;flex-shrink:0;transition:background .15s}.slot-refresh:hover{background:#ff444426}.slot-refresh-spin{animation:spin-refresh .7s linear infinite}@keyframes spin-refresh{to{transform:rotate(360deg)}}.slot-notif-badge{position:absolute;top:-5px;right:-5px;background:var(--red);color:#fff;font-size:6px;font-family:"Press Start 2P",monospace;width:10px;height:10px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;pointer-events:none}.slot-info{padding:8px 10px;font-size:7px;line-height:1.9;color:var(--text-dim)}.info-stage{color:var(--text)}.info-next{color:var(--text-muted)}.info-ready{color:var(--orange);animation:blink-text 1.2s infinite}.info-help{color:var(--blue)}@keyframes blink-text{0%,to{opacity:1}50%{opacity:.5}}.slot-progress-bar{height:3px;background:var(--border);margin:4px 0 2px}.slot-progress-fill{height:100%;background:var(--green);transition:width .4s}.slot-canvas-area{flex:1;display:flex;align-items:flex-end;justify-content:center;padding:6px 8px 0;position:relative}.slot-canvas-area canvas{image-rendering:pixelated;display:block}.slot-terrain-area canvas{display:block;width:100%;image-rendering:pixelated}.slot-footer{padding:8px 10px 10px}.slot-countdown{font-size:7px;color:var(--green);text-align:center;padding:6px 0}.empty-plot-inner{display:flex;flex-direction:column;align-items:center;gap:8px}.empty-plot-inner canvas{image-rendering:pixelated}.empty-plot-label{font-size:8px;color:var(--text-muted);text-align:center;line-height:1.8}.sticker-bubbles{position:absolute;top:6px;right:6px;display:flex;flex-direction:column;gap:4px}.sticker-bubble{font-size:18px;cursor:pointer;line-height:1;filter:drop-shadow(0 0 4px rgba(0,0,0,.8));animation:bubble-in .3s ease both;display:block;text-align:center}.sticker-bubble:hover{transform:scale(1.3);transition:transform .1s}@keyframes bubble-in{0%{transform:scale(0) rotate(-20deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.sticker-bubble:nth-child(2){animation-delay:60ms}.sticker-bubble:nth-child(3){animation-delay:.12s}.sticker-picker-label{font-size:7px;color:var(--text-muted);margin-bottom:8px}.sticker-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:12px}.sticker-btn{background:var(--bg);border:1px solid var(--border);font-size:20px;padding:6px;cursor:pointer;transition:border-color .1s,transform .1s;line-height:1;text-align:center}.sticker-btn:hover{border-color:var(--blue);transform:scale(1.15)}.sticker-btn.sticker-active{border-color:var(--blue);background:#000a1a;box-shadow:0 0 8px #48f4}.sticker-selected{text-align:center;font-size:36px;margin:6px 0 10px;min-height:44px;line-height:1;filter:drop-shadow(0 0 8px rgba(68,136,255,.5))}.friend-search-area{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.pixel-input{flex:1;min-width:180px;padding:10px 14px;background:var(--bg-card);border:2px solid var(--border);color:var(--text);font-family:"Press Start 2P",monospace;font-size:9px}.pixel-input:focus{outline:none;border-color:var(--green)}.pixel-input::placeholder{color:var(--text-muted)}.friend-garden-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:8px}.friend-garden-title{font-size:11px;color:var(--blue)}.empty-state{text-align:center;padding:40px 20px;font-size:8px;color:var(--text-muted);border:1px dashed var(--border);line-height:2}.social-idle{text-align:center;padding:20px 0}.social-idle-icon{font-size:40px;margin-bottom:14px}.social-idle-desc{font-size:8px;color:var(--text-muted);line-height:2;margin-bottom:16px}.social-legend{display:flex;justify-content:center;gap:16px;font-size:7px;color:var(--text-dim);margin-bottom:18px;flex-wrap:wrap}.social-loading{text-align:center;padding:60px 20px}.social-loading-spinner{font-size:36px;margin-bottom:14px;animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.social-loading p{font-size:9px;color:var(--text)}.social-loading-sub{font-size:7px!important;color:var(--text-muted)!important;margin-top:8px}.social-error{text-align:center;padding:40px 20px;font-size:8px;color:var(--text-muted)}.network-viz-wrap{margin:0 -16px;position:relative}.network-svg{display:block;width:100%;max-width:480px;margin:0 auto}.network-hint{text-align:center;font-size:6.5px;color:var(--text-muted);margin:4px 0 14px;letter-spacing:.5px}.social-detail-card{background:var(--bg-card);border:1px solid var(--green);padding:14px;margin-bottom:16px;animation:fadeIn .15s ease}.detail-header{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}.detail-avatar{width:40px;height:40px;border-radius:50%;border:2px solid var(--green);object-fit:cover;image-rendering:pixelated;flex-shrink:0}.detail-meta{flex:1;min-width:0}.detail-username{font-size:9px;color:var(--green);margin-bottom:4px}.detail-score{font-size:7px;color:var(--text-muted)}.detail-breakdown{display:flex;flex-wrap:wrap;gap:6px}.bd-item{font-size:6.5px;color:var(--text-dim);background:#0a1a0a;border:1px solid var(--border);padding:3px 7px}.social-rank-list{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.social-section-title{font-size:8px;color:var(--text-muted);margin-bottom:10px;letter-spacing:1px}.rank-item{display:flex;align-items:center;gap:10px;background:var(--bg-card);border:1px solid var(--border);padding:8px 10px;cursor:pointer;transition:border-color .1s}.rank-item:hover{border-color:#2a5a2a}.rank-item.rank-selected{border-color:var(--green)}.rank-num{font-size:7px;color:var(--text-muted);width:22px;flex-shrink:0}.rank-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;image-rendering:pixelated;border:1px solid var(--border);flex-shrink:0}.rank-info{flex:1;min-width:0}.rank-username{font-size:7.5px;color:var(--text);margin-bottom:4px}.rank-badges{display:flex;gap:5px;flex-wrap:wrap}.badge{font-size:5.5px;padding:2px 5px;border:1px solid}.badge-mutual{color:var(--green);border-color:var(--green)}.badge-follow{color:var(--blue);border-color:var(--blue)}.badge-follower{color:var(--orange);border-color:var(--orange)}.rank-score{font-size:9px;color:var(--orange);font-weight:700;margin-right:4px;flex-shrink:0}.social-rescan{text-align:center;padding:8px 0 20px}.shop-layout{display:flex;flex-direction:column;gap:30px}.shop-section-title{font-size:10px;color:var(--text-dim);margin-bottom:6px;padding-bottom:8px;border-bottom:1px solid var(--border)}.shop-section-desc{font-size:7px;color:var(--text-muted);margin-bottom:12px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.shop-item{background:var(--bg-card);border:2px solid var(--border);padding:14px;display:flex;flex-direction:column;gap:6px;transition:border-color .15s}.shop-item:hover{border-color:#333}.shop-item.item-featured{border-color:var(--green)}.shop-item-name{font-size:9px;color:var(--text)}.shop-item-canvas{display:block;margin:6px auto;image-rendering:pixelated}.shop-item-price{font-size:10px;color:var(--orange)}.shop-item-price.price-free{color:var(--green)}.shop-item-desc{font-size:7px;color:var(--text-muted);line-height:1.7;flex:1}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e0;display:flex;align-items:center;justify-content:center;z-index:999;padding:20px}.modal-box{background:var(--bg-card);border:2px solid var(--green);max-width:480px;width:100%;box-shadow:0 0 60px #0f03}.modal-title{padding:14px 18px;font-size:10px;color:var(--green);border-bottom:1px solid var(--border)}.modal-body{padding:18px;font-size:8px;line-height:1.9;color:var(--text-dim);max-height:70vh;overflow-y:auto}.modal-footer{padding:12px 18px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}.modal-reward-big{text-align:center;padding:14px 0}.reward-icon{font-size:32px;margin-bottom:10px}.reward-amount{font-size:18px;margin-bottom:6px}.reward-green{color:var(--green)}.reward-gold{color:var(--gold)}.reward-label{font-size:8px;color:var(--text-muted)}.level-up-notice{background:#001a00;border:1px solid var(--green);padding:10px;text-align:center;color:var(--green);font-size:9px;margin-top:12px}.modal-plant-list{display:flex;flex-direction:column;gap:8px}.plant-option{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border:1px solid var(--border);cursor:pointer;transition:border-color .1s,background .1s;gap:10px}.plant-option:hover{border-color:var(--green);background:#0a1a0a}.plant-option-left{flex:1}.plant-option-name{font-size:8px;color:var(--text);margin-bottom:4px}.plant-option-desc{font-size:7px;color:var(--text-muted);line-height:1.6}.plant-option-price{font-size:9px;text-align:right;white-space:nowrap}.price-free-tag{color:var(--green)}.price-hive-tag{color:var(--orange)}.modal-info-table{width:100%;border-collapse:collapse}.modal-info-table td{padding:6px 0;border-bottom:1px solid #1a1a1a;font-size:7px}.modal-info-table td:first-child{color:var(--text-muted);width:55%}.modal-info-table td:last-child{color:var(--text);text-align:right}.roi-modal{display:flex;flex-direction:column;gap:14px}.roi-intro{font-size:7px;color:var(--text-muted);line-height:1.8;font-style:normal}.roi-intro em{color:var(--text-dim);font-style:normal}.roi-list{display:flex;flex-direction:column;gap:10px}.roi-row{background:#0c0c0c;border:1px solid var(--border);padding:10px 12px;display:flex;flex-direction:column;gap:6px}.roi-tree-name{font-size:8px}.roi-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.roi-stat{display:flex;flex-direction:column;gap:2px}.roi-label{font-size:6px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.roi-val{font-size:7px;color:var(--text)}.roi-green{color:var(--green)}.roi-orange{color:var(--orange)}.roi-gold{color:var(--gold)}.roi-bar-track{height:3px;background:var(--border);border-radius:1px;overflow:hidden}.roi-bar-fill{height:100%;border-radius:1px;transition:width .4s}.roi-extra{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.roi-tag{font-size:6px;color:var(--blue);background:#001020;border:1px solid #4488ff44;padding:2px 5px}.roi-tag-dim{font-size:6px;color:var(--text-muted)}.roi-notes{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--border);padding-top:10px}.roi-note{font-size:7px;color:var(--text-muted);line-height:1.8}.roi-note-label{color:var(--text-dim);display:block;margin-bottom:2px}.roi-toggle{background:none;border:none;color:var(--text-muted);font-family:"Press Start 2P",monospace;font-size:6px;cursor:pointer;padding:2px 0;text-align:left}.roi-toggle:hover{color:var(--text-dim)}.roi-stages{display:flex;flex-direction:column;gap:3px;padding:6px 0;border-top:1px solid var(--border)}.roi-stage-row{display:grid;grid-template-columns:70px 36px 90px 1fr;gap:6px;align-items:center}.roi-stage-name{font-size:6px;color:var(--text-dim)}.roi-stage-mult{font-size:6px}.roi-stage-val{font-size:6px;color:var(--text)}.roi-stage-days{font-size:6px;color:var(--text-muted)}.toast{position:fixed;bottom:20px;right:20px;background:var(--bg-card);border:2px solid var(--green);padding:10px 16px;font-size:8px;color:var(--green);z-index:9999;max-width:300px;line-height:1.6;animation:toast-in .2s ease}.toast-error{border-color:var(--red);color:var(--red)}.toast-warning{border-color:var(--orange);color:var(--orange)}.toast-info{border-color:var(--blue);color:var(--blue)}@keyframes toast-in{0%{transform:translate(30px);opacity:0}to{transform:translate(0);opacity:1}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border)}::-webkit-scrollbar-thumb:hover{background:var(--green)}@media (max-width: 600px){.game-header{justify-content:center}.header-brand{display:none}.header-player{align-items:center}}