:root{--p-black: #0a0a0a;--p-white: #f8fafc;--p-blue: #3b82f6;--p-green: #4ade80;--p-purple: #a855f7;--p-red: #ef4444;--p-yellow: #fbbf24;--pixel-border: 4px solid #000;--neon-shadow: 0 0 10px rgba(74, 222, 128, .5)}*{box-sizing:border-box;margin:0;padding:0;image-rendering:pixelated}body{background-color:var(--p-black);color:var(--p-white);font-family:Courier New,Courier,monospace;overflow:hidden;-webkit-user-select:none;user-select:none}.pixel-app{width:100vw;height:100vh;display:flex;flex-direction:column;transition:background 2s ease}.day{background:linear-gradient(180deg,#1e293b,#334155)}.night{background:linear-gradient(180deg,#020617,#0f172a)}.cloud-indicator{position:absolute;top:10px;left:20px;font-size:10px;background:#000c;padding:4px 12px;border-radius:4px;border:2px solid var(--p-blue);display:flex;align-items:center;gap:8px;z-index:100}.syncing{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.hud-top{height:80px;display:flex;justify-content:space-between;align-items:center;padding:0 30px;background:#0009;border-bottom:4px solid #000;z-index:50}.stat-group{display:flex;align-items:center;gap:15px}.pixel-avatar{width:48px;height:48px;background:#1e293b;border:3px solid var(--p-blue);display:flex;align-items:center;justify-content:center;overflow:hidden}.pixel-avatar img{width:100%;height:100%;object-fit:contain}.bar-container{width:140px}.bar-label{font-size:10px;color:var(--p-blue);margin-bottom:4px;font-weight:700}.bar-bg{height:12px;background:#000;border:2px solid #334155}.bar-fill{height:100%;background:var(--p-green);box-shadow:0 0 8px var(--p-green);transition:width .3s}.env-group{display:flex;gap:20px;font-weight:700;font-size:14px}.pixel-time,.pixel-weather{display:flex;align-items:center;gap:8px;background:#000;padding:6px 12px;border:2px solid #334155}.main-stage{flex:1;display:flex;padding:15px;gap:15px;overflow:hidden}.side-panel{width:260px;background:#0f172ae6;border:4px solid #000;display:flex;flex-direction:column;box-shadow:8px 8px #00000080}.panel-tabs{display:flex;border-bottom:4px solid #000}.panel-tabs button{flex:1;padding:12px;background:#1e293b;border:none;color:#64748b;cursor:pointer}.panel-tabs button.active{background:var(--p-blue);color:#fff}.panel-content{flex:1;padding:10px;overflow-y:auto}.item-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.pixel-slot{aspect-ratio:1;background:#0f172a;border:2px solid #334155;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:5px}.pixel-slot.has-item{border-color:var(--p-blue)}.slot-name{font-size:9px;text-align:center;color:#94a3b8}.slot-count{position:absolute;bottom:2px;right:4px;font-size:10px;font-weight:700;color:var(--p-yellow)}.world-viewport{flex:1;display:flex;flex-direction:column;gap:10px}.map-switcher{display:flex;justify-content:center;gap:10px}.map-switcher button{background:#000;border:3px solid #334155;color:#fff;padding:8px 20px;cursor:pointer;font-weight:700;font-family:inherit}.map-switcher button.active{border-color:var(--p-green);color:var(--p-green);background:#4ade801a}.pixel-map{flex:1;background-color:#1a1a1a;border:4px solid #000;position:relative;overflow:hidden;background-size:cover;background-position:center}.scanline-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;background:linear-gradient(#12101000 50%,#0000001a 50%),linear-gradient(90deg,#ff000008,#00ff0003,#0000ff08);background-size:100% 4px,3px 100%}.pixel-entity{position:absolute;width:64px;height:64px;margin-left:-32px;margin-top:-32px;display:flex;flex-direction:column;align-items:center;z-index:5}.sprite-box{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.sprite-box img{width:100%;height:100%;object-fit:contain}.entity-tag{font-size:8px;background:#000;color:#fff;padding:2px 6px;border:1px solid #fff;margin-top:4px;white-space:nowrap}.player .entity-tag{background:var(--p-blue);border-color:#fff}.pixel-btn-lg{background:var(--p-green);border:4px solid #000;padding:15px 40px;font-family:inherit;font-weight:700;font-size:20px;cursor:pointer;box-shadow:6px 6px #000;transition:all .1s}.pixel-btn-lg:active{transform:translate(3px,3px);box-shadow:3px 3px #000}.pixel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;z-index:1000;display:flex;align-items:center;justify-content:center}.pixel-modal{background:#1e293b;border:6px solid #000;padding:50px;text-align:center;box-shadow:15px 15px #00000080}.glitch-text{font-size:40px;color:var(--p-green);text-shadow:4px 4px var(--p-red);margin-bottom:20px}.pixel-toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%);background:#000;border:3px solid var(--p-green);padding:12px 24px;color:var(--p-green);font-weight:700;z-index:2000}.scrollbar-hide::-webkit-scrollbar{display:none}